'I am not able to implement recordrtc

I am not able implement recordrtc. I took the following code from the site:

https://medium.com/@coolchoudharyvijay/use-mic-in-angular-to-record-audio-simplified-1374d89718d3

I modified the code a bit as I am using the latest version of typescript and had to initialize and add the type to variables. I suspect I didn't install properly recordrtc.

code

import { Injectable } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
import * as RecordRTC from 'recordrtc';

@Injectable({
  providedIn: 'root'
})
export class RecordNameService {

  title = 'micRecorder';

  //Lets declare Record OBJ
  record!: RecordRTC.StereoAudioRecorder;
  //Will use this flag for toggeling recording
  recording = false;
  //URL of Blob
  url: string;
  error: string;
  constructor(private domSanitizer: DomSanitizer) {
    this.url = "";
    this.error = "";
  }
  sanitize(url: string) {
    return this.domSanitizer.bypassSecurityTrustUrl(url);
  }
  /**
   * Start recording.
   */
  initiateRecording() {

    this.recording = true;
    let mediaConstraints = {
      video: false,
      audio: true
    };
    navigator.mediaDevices
      .getUserMedia(mediaConstraints)
      .then(this.successCallback.bind(this), this.errorCallback.bind(this));
  }
  /**
   * Will be called automatically.
   */
  successCallback(stream: MediaStream) {
    var options = {
      mimeType: "audio/wav",
      numberOfAudioChannels: 1,
      sampleRate: 16000,
    };
    //Start Actuall Recording
    this.record = new  RecordRTC.StereoAudioRecorder(stream, options);
    this.record.record();
    

  }
  /**
   * Stop recording.
   */
  stopRecording() {
    this.recording = false;
    this.record.stop(this.processRecording.bind(this));
  }
  /**
   * processRecording Do what ever you want with blob
   * @param  {any} blob Blog
   */
  processRecording(blob: any) {
    this.url = URL.createObjectURL(blob);
    console.log("blob", blob);
    console.log("url", this.url);
    
  }
  /**
   * Process Error.
   */
  errorCallback(error: any) {
    this.error = 'Can not play audio in your browser';
  }
  ngOnInit() {

  }

}

On visual studio code I am getting:

Property 'record' does not exist on type 'StereoAudioRecorder'

in the line of code:

this.record.record();

and

   this.record.stop(this.processRecording.bind(this));

What can be the problem?. can someone try to run my code?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source