CODEWITHSUNDEEP
angular
Jon
Jon

Reputation: 445

Play An MP3 in Angular Using <audio> Tag

Very new to Angular. I'm trying to play a hard-coded mp3 file with Angular

I have the mp3 file in the same path as my component, and I'm trying to use the tag like:

<audio controls src={{./name-of-file.mp3}}></audio>

However, this is not working. Is there a straightforward way to hardcode a brief mp3 file into my app?

Upvotes: 4

Views: 7492

Answers (4)

dammika rajapaksha
dammika rajapaksha

Reputation: 22

for audio

<audio controls>
    <source src="horse.ogg" type="audio/ogg">
    <source src="horse.mp3" type="audio/mpeg">
    Your browser does not support the audio element.
</audio>

Upvotes: 0

Shanaka Anuradha
Shanaka Anuradha

Reputation: 398

This also should work. In your typescript file, You can set myAudio variable with the audio source

<audio controls><source [src]="myAudio" /></audio>

Upvotes: 0

JiBi
JiBi

Reputation: 388

any img/icon/music should be put in the assets folder

or you could configure in angular.json other assets folders paths

Upvotes: 2

Jon
Jon

Reputation: 445

Okay, actually it looks like Angular just didn't like the file location. Moving the audio file to another folder did the trick: <audio controls><source src="../../audio/name-of-file.mp3" type="audio/mpeg" /></audio>

Upvotes: 2

Related Questions