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(); // 停止

阅读 146

推荐阅读