getParticipantsInfo is undefined Iframe api

I’m using jitsi Iframe api on my angular app :

import { Location } from '@angular/common';
import { AfterViewInit, Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
// import 'src/vendor/jitsi/external_api.js';

declare var JitsiMeetExternalAPI: any;

@Component({
  selector: 'app-video-comunication',
  templateUrl: './video-comunication.component.html',
  styleUrls: ['./video-comunication.component.css']
})
export class VideoComunicationComponent implements OnInit, AfterViewInit {
  title = 'app';
  domain:string = "meet.jit.si";
  options: any;
  api: any;
  roomId: string;
  viewVideoDiv: boolean = true;
  username: string;

constructor(private route: ActivatedRoute, private location: Location)
{
}
ngOnInit(){
   this.roomId = this.route.snapshot.paramMap.get('roomId') as string;
}
ngAfterViewInit(): void {


  this.options = {
    roomName: this.roomId,
    width: 900,
    height: 500,
    parentNode: document.querySelector('#meet'),
    userInfo: {
        displayName: 'hey hey hey'
    }
}
  this.route.queryParams.subscribe((params: any) => {
    this.username = params.username;
  })

  this.api = new JitsiMeetExternalAPI(this.domain, this.options);
  this.api._frame.allow = 'camera; microphone; display-capture; autoplay; clipboard-write';

  console.log('---------------');
  console.log(this.api);
  console.log('---------------');

  this.api.addEventListener('videoConferenceLeft',(e: any) => {this.leaveMeeating(e)});
  this.api.executeCommands({ toggleAudio: [], toggleVideo:[]});
  // this.api.executeCommands({
  //   displayName: this.username,
  // });

  console.log(this.api.getParticipantsInfo());

  }
leaveMeeating(event: any){
     this.viewVideoDiv = false;
     this.location.back();
}
}

and always I recieve this error

Which version of jitsi-meet is deployed on the server where you source the iframeAPI?

thank you for your reply @damencho

<script src='https://meet.jit.si/external_api.js'></script>

I’m using this script on my angular app

I see you are using meet.jit.si as deployment … are you downloading the latest exrenal_api.js from there?

In general, you should be sourcing the script on every load, to make sure you are using the correct version with the current deployment.

And if you are using meet.jit.si you need to make sure you follow the terms and conditions.

thank you @damencho,
please could you tell me how can I know which version I’m using ?

<script src=‘https://meet.jit.si/external_api.js’></script>

If you are sourcing it, that should be ok.

It tried adding:

console.log('---------------');
  console.log(this.api);
  console.log('---------------');
  console.log(this.api.getParticipantsInfo());

in the example: jitsi-meet/api.html at master · jitsi/jitsi-meet · GitHub
And it worked just fine.
image

By the way, this should already be taken care of for you.