Ionic 3 with Angular 5 node.js play an audio on button click

Question

I`m stuck in a situation where i have to play an audio from assets folder in my project on button click.

here is my html code

<ion-header>
<ion-navbar color = "primary">
 <ion-title>

 Norrani Qaida
</ion-title>
 </ion-navbar>
   </ion-header>



  <ion-content >


   <button class = "button" ng-click = "playAudio()">PLAY</button>


   </ion-content>

here is my .ts controller code

    import { Component } from '@angular/core';
    import { NavController } from 'ionic-angular';
    import { AboutPage } from '../about/about';
    import { NativeAudio } from '@ionic-native/native-audio';

    @Component({
     selector: 'page-home',
     templateUrl: 'home.html'
   })
   export class HomePage {


   constructor() {


 }
   }

anyone here helps me to write playaudio() function in controller to play an audio on button click from assets in project

Possible duplicate of [How to play mp3 with Angular 2?](https://stackoverflow.com/questions/33859270/how-to-play-mp3-with-angular-2) — Ivar Reukers, May 23 '18 at 08:31

score 0 · Answer 1 · answered May 23 '18 at 10:00

0

Since you have already imported NativeAudio, its very easy. Just do this:

constructor(private nativeAudio: NativeAudio) { 
       this.nativeAudio.preloadSimple('uniqueId1', 'path/to/file.mp3').then(onSuccess, onError);
}

playAudio () {
  this.nativeAudio.play('uniqueId1').then(onSuccess, onError);
}

Source

answered May 23 '18 at 10:00

Saksham Gupta

620
6
14

Not Working ! :( – Eye Softech May 23 '18 at 12:56
1.Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[HomePage -> NativeAudio]: 2. Error: StaticInjectorError(AppModule)[HomePage -> NativeAudio]: these errors are encountered – Eye Softech May 23 '18 at 12:57
You need to add NativeAudio in your providers array in AppModule – Saksham Gupta May 24 '18 at 07:34

Ionic 3 with Angular 5 node.js play an audio on button click

1 Answers1