2015-11-29 55 views
0

我已經構建了一個angularjs指令來播放離子應用程序中的音頻文件。我還在我的指令中顯示音頻文件的時長和類似內容。因此,如果我想通過ondurationchange Event顯示音頻文件的持續時間,它在iOS上可以正常工作,但在Android上,事件永遠不會被調用。html5音頻對象ondurationchange未呼籲android

我的代碼如下所示:

$scope.audioObj = new Audio(url); 

if(isNaN(AAudioService.getDuration())) { 
    $scope.audioObj.ondurationchange = function() { 
    console.log($scope.audioObj.duration.toFixed(1)); 
} 

這裏有什麼問題嗎?

+0

嘗試看看[這裏](HTTPS: // githu b.com/arielfaur/ionic-audio)。 –

回答

0

您可以使用Ionic-audio來實現此目的。它在內部使用Cordova Media Plugin

Working Plunker

app.js

//Add it as dependency 
angular.module('starter', ['ionic', 'starter.controllers', 'ionic-audio']) 

controllers.js

angular.module('starter.controllers', []) 

.controller('MusicCtrl', function($scope) { 
    $scope.track = { 
     url: 'https://www.example.com/my_song.mp3', 
     artist: 'Somebody', 
     title: 'Song name', 
     art: 'img/album_art.jpg' 
    } 
}); 

yourtemplate.html

<ion-view view-title="Music"> 
    <ion-content> 
     <ion-audio-track track="track"> 
      <div class="list list-inset"> 
       <div class="item item-thumbnail-left"> 
        <img src="{{track.art}}"> 
        <h2>{{track.title}}</h2> 
        <p>{{track.artist}}</p> 
        <ion-audio-controls> 
         <a class="button button-icon icon" ion-audio-play></a> 
         <ion-spinner icon="ios"></ion-spinner> 
        </ion-audio-controls> 
       </div> 
       <div class="item"> 
       <ion-audio-progress-bar display-time></ion-audio-progress-bar> 
       </div> 
      </div> 
     </ion-audio-track> 
    </ion-content> 
</ion-view>