如何在 Angular 中自动播放 youtube 组件？

Question

我正在使用 Angular 11 和 Angular Youtube 组件，但我只是不知道如何在不手动播放的情况下自动播放它请问有人能帮帮我吗？

     <youtube-player  
        [videoId]="'wZti8QKBWPo'" 
        [playerVars]="{controls: 0, mute: 1, autoplay: 1}"
        (ready)="onReady($event)"
        [startSeconds]="30"
        [width]="width"
        [height]="height">
    </youtube-player>

当我将额外的配置 [playersVars] 传递给播放器组件时，唯一属性起作用的是控件属性，其余的什么都没有，我尝试从 ts 文件绑定而不是传递html 文件中的对象字面量，那么静音属性也可以在控件中工作，

Answer 1

我又检查了一个例子，它有效。它不起作用的原因之一是 startSeconds 属性。不知何故，当我们添加此属性时，它会停止自动播放视频。但没有它，它也能很好地工作。

import { Component, OnInit } from '@angular/core';

@Component({
  template: `
    <youtube-player
      [playerVars]="playerConfig"
      [width]=640
      [height]=320
      [videoId]="videoId"
      (ready)="onReady($event)"
    ></youtube-player>
  `,
  selector: 'app-video'
})
export class VideoComponent implements OnInit {
  playerConfig = {
    controls: 0,
    mute: 1,
    autoplay: 1
  };
  videoId = 'XqZsoesa55w';
  ngOnInit() {
    const tag = document.createElement('script');

    tag.src = 'https://www.youtube.com/iframe_api';
    document.body.appendChild(tag);
  }

  onReady(e): void {
    console.log(e, 'its ready')
  }
}

这里是working example of app.

如何在 Angular 中自动播放 youtube 组件？

How to autoplay youtube component in Angular?

angular

angular-material

youtube

components