HTML5ビデオを再生して他の人を止める

Question

私はHTML5のページに表示されるビデオのリストを持っていますが、私が再生したいのは、他の人が停止/一時停止する必要があるということです。

私はAngular 2 TypeScriptを使用しています。

<video controls (click)="toggleVideo()" #videoPlayer> 
    <source class="embed-responsive-item" src="{{ video.url }}" type="video/mp4" /> 
       Browser not supported 
</video> 

@ViewChild('videoPlayer') videoplayer: any; 

toggleVideo(event: any) { 
    this.videoplayer.nativeElement.play(); 
} 

Answer 1

クエリ@ViewChildrenデコレータを使用して、ページ上のすべてのビデオ。クリックすると、すべての動画が一時停止され、クリックされた動画が再生されます（既に行っているように）。

すべてのビデオを照会するには、セレクタ'video'でダミーの指示文を作成します。次に、このディレクティブを@ViewChildrenの引数として使用し、ディレクティブインスタンス（デフォルト）の代わりにElementRefを必ず読んでください。

@ViewChildren(VideoDirective, {read: ElementRef}) 
public videos: QueryList<ElementRef>