How to define JitsiMeetExternalAPI in angular 8

Question

I'm using jisti application to implement video call in angular 8,am not understanding JitsiMeetExternalAPI how to define this. please help me on this.(Am getting error as error TS2304: Cannot find name 'JitsiMeetExternalAPI'.).

Answer 1

Simply add this line to app.component.ts.

declare var JitsiMeetExternalAPI: any;

In my case, it worked fine.

Finally, the code looks like this.

import { Component, AfterViewInit } from '@angular/core';
import '../vendor/jitsi/external_api.js';

declare var JitsiMeetExternalAPI: any;

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'sidenav';
  domain: string = "meet.jit.si";
  options: any;
  api: any;

  constructor() {
  }

  ngAfterViewInit(): void {

    this.options = {
      roomName: "JitsiMeetAPIExample",
      width: 700,
      height: 700,
      parentNode: document.querySelector('#meet')
    }

    this.api = new JitsiMeetExternalAPI(this.domain, this.options);
  }
}

Answer 2

I was facing the same issue and solved by pointing to the script in angular.json like the following ...

"scripts": ["src/vendor/jitsi/external_api.js"]

I had to download and copy the https://meet.jit.si/external_api.js script onto "src/vendor/jitsi" directory of my angular code.