Ionic - Cordova Native Audio

This plugin is used for adding native audio sounds to the Ionic app.

Using Native Audio

To be able to use this plugin, we have a tendency to 1st have to be compelled to install it. Open the prompt window and add the Cordova plugin.

C:\Users\Username\Desktop\MyApp>cordova plugin add cordova-plugin-nativeaudio

The next step is to preload the audio file. There are two options available, which are −

  • preloadSimple − It is used for simple sounds that will be played once.

  • preloadComplex − It is for sounds that will be played as looping sounds or background audio.

Add the subsequent code to your controller to preload Associate in Nursing audio file. we want to make certain that the Ionic platform is loaded before we will preload the audio file.

Controller Code

$ionicPlatform.ready(function() {
   .preloadSimple('click', 'js/click.mp3')
   .then(function (msg) {
   }, function (error) {

   $cordovaNativeAudio.preloadComplex('click', 'js/click.mp3', 1, 1)
	.then(function (msg) {
   }, function (error) {

In the same controller, we will add code for playing audio. Our $timeout function will stop and unload looping audio after five seconds.

$scope.playAudio = function () {

$scope.loopAudio = function () {

   $timeout(function () {
   }, 5000);

The last thing we need is to create buttons for playing and looping audio.


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

<button class = "button" ng-click = "loopAudio()">LOOP</button>

When we regulator on play button, we tend to area unit about to hear the sound once and once we tend to regulator on the loop button, the thereforeund will loop for five seconds so stop. This plugin works entirely on associate person or a mobile device.