title: Ionic slide box How to play a sound when switching slide? without a click
body: <p>i want to play a sound when switching slides from ionic slide box, i need it without clicking buttons, i have already tried to put a ng-focus directive from angular and i tried the property on-slide-changed from ionic slide box... here is my code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;ion-slide-box on-slide-changed="slideHasChanged($index)" class="fondo-rojo" show-pager="false" does-continue="true" ng-if="sencillo.length"&gt;
                  &lt;ion-slide ng-repeat="senci in sencillo" ng-init="play('/android_asset/www/raw/'+senci.sound_title+'.mp3')" repeat-done="repeatDone()"&gt;
                        
                             &lt;h1 class="margen-slide slide-estilo"&gt;{{senci.title}}&lt;/h1&gt;
                             &lt;a align="center" style="text-align:center !important;" ng-click="play('/android_asset/www/raw/'+senci.sound_title+'.mp3')"&gt;&lt;img style="text-align:center !important;"  ng-src="img/sonidos/play.png" width="70px" height="70px"&gt;&lt;/a&gt;
                             &lt;!--&lt;button ng-click="nextSlide()"&gt; &gt;&gt; &lt;/button&gt;--&gt;
                         
                  &lt;/ion-slide&gt;
              &lt;/ion-slide-box&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Controller</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>.controller("mediaCtrl", function($scope,$ionicPlatform, $cordovaMedia, $ionicLoading) {
   $ionicPlatform.ready(function(){
      $scope.play = function(src) {
          var media = $cordovaMedia.newMedia(src);
          //var media = new Media(src, null, null, mediaStatusCallback);
          media.play();
          //$cordovaMedia.play(media);
      }
   
      var mediaStatusCallback = function(status) {
          if(status == 1) {
              $ionicLoading.show({template: 'Loading...'});
          } else {
              $ionicLoading.hide();
          }
      }
      $scope.slideHasChanged = function(src,$index){
          
          console.info("El Slide Cambio y es el: " + $index);
          //alert('slideHasChanged $index=' + $index);
         if($index &gt;= 0){
              $scope.play(src);
         }
       };
   })
      
  })</code></pre>
  </div>
  </div>
  </p>
  
  <p>I hope you can help me thanks for read, regards...</p>