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