使用同一音频对象时，JavaScript音频多次播放

Question

我有一个播放JavaScript音频的功能，如下所示：

  playSound(sub) {
    console.log(sub);
    if (sub.audio.paused) {
      sub.audio.ontimeupdate = function (i) {
        if ((this.currentTime / this.duration) > 0.9) {
          this.currentTime = 0;
          this.play();
        }
      };
      sub.audio.play();
    } else {
      sub.audio.pause();
      sub.audio.currentTime = 0;
    }
  }

我这样在HTML中调用此函数：

(click)="playSound(sub)"

一切都很好，并且工作得很好，直到我以编程方式尝试播放音频，然后在if语句的另一个函数中调用playSound（）函数。 音频可以成功播放，但是每当我尝试使用（据我所知）参数中给定的完全相同的Audio对象，使用上述（单击）函数调用HTML中的完全相同的功能时，声音就会播放两倍吗？

这是缓存问题吗？ 还是制作原始副本的Angular问题，以便音频实例多次播放？

我也试过了HowlerJS，这给了我完全相同的问题，在演奏时，Howler似乎制作了不同的ID。

这是调用playSound函数的地方

  setSleepyset() {
    this.muteAll();
    for (let i = 0; i < this.items.length; i++) {
      for (let x = 0; x < this.items[i].subitems.length; x++) {
        if (localStorage.getItem(this.items[i].subitems[x].audio.src) !== null) {
          this.playSound(this.items[i].subitems[x]);
        } else {
          this.items[i].subitems[x].audio.pause();
          this.items[i].subitems[x].audio.currentTime = 0;
        }
      }
    }
  }

这是制作HTML音频对象的地方：

items = [
    {
      category: "Weather",
      expanded: true,
      subitems: [
        {
          name: "Rain",
          background: "../assets/backgrounds/rain.jpg",
          sound: "../assets/sounds/rain.ogg",
          audio: new Audio('../assets/sounds/rain.ogg'),
          icon: "../assets/icons/rain.png",
          playing: false
        },
        {
          name: "Thunder",
          background: "../assets/backgrounds/thunder.jpg",
          sound: "../assets/sounds/thunder.ogg",
          audio: new Audio('../assets/sounds/thunder.ogg'),
          icon: "../assets/icons/thunder.png",
          playing: false
        },
        {
          name: "Wind",
          background: "../assets/backgrounds/wind.jpg",
          sound: "../assets/sounds/wind.ogg",
          audio: new Audio('../assets/sounds/wind.ogg'),
          icon: "../assets/icons/wind.png",
          playing: false
        }
      ]
    }
]

目标是同时播放多个声音并同时加载它们，除非我可以在同一个变量中播放/暂停多个音频源，否则全局Audio变量不是解决方案。

Answer 1

固定！

原来，我从另一个实例调用了该函数，我使用了一个提供程序，该提供程序创建了Home类的新实例，每次在侧面菜单中调用playSound时都创建了一个新的Audio对象。