I am trying to wrap Angular/Youtube component, described here.

This stackblitz is the result.

The problem here is that

<youtube-player
  #musicPlayer
  [videoId]="extractVideoId(videoId)"
  (ready)="onReadyInternal($event)">
</youtube-player>

is not firing at all the onReadyevent. I never have my console log.

  onReadyInternal(event: any): void {
    console.log(event, 'Is Ready');
    this.onReady.emit(event);
  }

I based my work on another question with a linked project. The onReady fires normally on this one, and the code looks very similar.

I am trying to wrap Angular/Youtube component, described here.

This stackblitz is the result.

The problem here is that

<youtube-player
  #musicPlayer
  [videoId]="extractVideoId(videoId)"
  (ready)="onReadyInternal($event)">
</youtube-player>

is not firing at all the onReadyevent. I never have my console log.

  onReadyInternal(event: any): void {
    console.log(event, 'Is Ready');
    this.onReady.emit(event);
  }

I based my work on another question with a linked project. The onReady fires normally on this one, and the code looks very similar.

• angular
• typescript
• youtube
• youtube-api
• angular-components

1 Answer 1

This is an issue on angular/components github.

bug(YouTubePlayer): startSeconds and ready not working #29874

The fix is provided in the PR:

Youtube player startSeconds and ready event not working #29986

You can upgrade angular and angular components to 18 to solve the problem.

I tried for a workaround but did not have luck.