Skip to content

RecordRTC on AngularJs

Muaz Khan edited this page Sep 22, 2018 · 1 revision

This answer is taken from amodb.com/../record-audio-using-recordrtc-in-angular-2-4-6

Install RecordRTC

npm install recordrtc

No need to include it in your app.module.ts. Just import it in your component eg. file.component.ts

import * as RecordRTC from 'recordrtc';

Example

import { Component } from '@angular/core';
import * as RecordRTC from 'recordrtc';

@Component({
    selector: 'app-file',
    templateUrl: './file.component.html',
    styleUrls: ['./file.component.css']
})


export class FileDropComponent implements OnInit {
    var record;

    constructor() {}

    // Call this when you want to start recording
    start(stream) {
        var options = {
            mimeType: "audio/wav",
            numberOfAudioChannels: 1

        };

        var StereoAudioRecorder = RecordRTC.StereoAudioRecorder;
        this.record = new StereoAudioRecorder(stream, options);
        this.record.record();
    }

    // Call this when you want to stop recording
    stopRecording() {
        this.record.stop(this.process.bind(this));
    }

    process(blob) {
        // Do whatever  you got the blob
        console.log(URL.createObjectURL(blob));
    }
};