Angular笔记——媒体播放

视频播放

<video src="../../../assets/restart3.mp4" id="video3" *ngIf="playVideo3" class="video" autoplay controls></video>

音频播放

<audio src="../../../assets/time.mp3" id="musicTime"></audio>

其中，autoplay表示视频加载完成自动播放,controls显示播放按钮等工具栏,loop循环播放

ts

import { ElementRef } from '@angular/core'; //加载组件

public element: ElementRef;
constructor(element: ElementRef) {
    this.element = element; //绑定element
}

// 在方法中
this.element.nativeElement.querySelector('#bgmusic').play(); // 经过id的方式，选择哪个媒体播放
this.element.nativeElement.querySelector('#bgmusic').pause(); // 中止