Angular 2 音频不会因更改组件而中断

Question

我想在这段代码的帮助下播放音频，它工作得很好

  ngOnInit () {
    const a = new Audio();
    a.src = '../../assets/hello.wav';
    a.load();
    // auto-start
    a.play();
  }

但是，当我单击“下一步”按钮时，这会将我带到下一页（因此我在路由的帮助下更改了我的组件），音频不会停止（不会中断），并且音频中的音乐也会在下一页上播放。我应该在代码中添加什么才能通过更改分页符音频来实现？

Answer 1

您应将其定义audio为组件的一个字段（以便在 ngOnDestroy 中访问它）并在 处销毁它ngOnDestroy。

audio: any;

ngOnInit () {
  this.audio = new Audio();
  this.audio.src = '../../assets/hello.wav';
  this.audio.load();
  // auto-start
  this.audio.play();
}

ngOnDestroy() {
  // destroy audio here
  if(this.audio) {
    this.audio.pause();
    this.audio = null;
  }
}