angular audio play on ngoninit not working

Question

html code:

<audio id="notification" src="../assets/audio/notification.mp3" autoplay="true"
muted="muted"></audio>

ts code:

 let audioPlayer = <HTMLAudioElement> document.getElementById('notification');
      audioPlayer.muted = false;
      audioPlayer.play();  

I am getting error play() failed because the user didn't interact with the document first.

Answer 1

You should not query audioPlayer on init. The audio needs a bit of time to be ready.

You should trigger muted and play when Html Audio can play. ( https://www.w3schools.com/tags/av_event_canplay.asp )

or Using ViewChild decorator. ( https://angular.io/api/core/ViewChild )