Question

我已将lighbox与youtube视频一起使用，例如：我希望一旦点击链接就会启动视频，我已经添加了一些能够做到的事情。

<p-lightbox type="content" id="pl">
    <a class="group" href="#" (click)="playVideo()">
        Watch Video
    </a>
    <iframe id="video" width="560" height="315" src="https://www.youtube.com/embed/9bZkp7q19f0" frameborder="0" allowfullscreen>    </iframe>
</p-lightbox>

现在是ts文件：

videoSrc = "('#video')[0].src";
playVideo() {
    this.videoSrc += "&amp;autoplay=1";
}

我没有任何错误，但它没有工作......

你可以帮我解决这个问题吗？

Answer 1

所以这解决了我的问题在我的HTML中我有这个代码

div *ngIf="videoData">
    <ul>
      <li id="videoList" *ngFor="let videoData of videoDatas.SopVideo"><a (click)="playVideo(videoData)" href="javascript: void(0)">{{videoData.Name|extension}}</a></li>
    </ul>
  </div>
  <div id="videoPlayer" [hidden]="hiddenVideo">
    <video width="800" id="video1" height="600" controls [src]="sopVideoUrl" [autoplay]="sopAutoPlay">
    </video>

当他们点击他们想要看的视频时，我会调用playvideo方法并传入有关该视频的所有数据。然后我绑定src并自动播放我的类型脚本中的变量。

public sopVideoUrl: String;
public sopAutoPlay = false;
playVideo(id: Sop) {
    this.hiddenVideo = false;
    this.sopAutoPlay = true;

    this.deleteButton = false;
    this.strVideoName = id.Name;
    this.sopVideoUrl = `./dist/videos/${this.strVideoName}`;

这会自动播放我的视频并获取用户点击的正确视频。

Angular2，PrimeNG。带有自动播放YouTube视频的灯箱

1 个答案: