Angular媒体播放器和动态内容

Question

I have method in my controller which get audio:

$scope.searchTracks = function(text) {
    Search.search.get({
        text: text
    }, function(data) {
        $scope.tracks = data;
        $sce.trustAsResourceUrl($scope.tracks.Mp3Ref);
    })
}

For playing i use this player: http://mrgamer.github.io/angular-media-player/

In template:

<div class="song_block" ng-repeat="track in tracks">
    ...
<audio media-player="trackPlayer" ng-src="[[ track.Mp3Ref ]]" ></audio>
<span ng-click="trackPlayer.playPause();" ng-class="{ 'pauseZ': trackPlayer.playing, 'playZ': !trackPlayer.playing} "></span>
 </div>

Also, I have a search bar that updates the tracks. So, when I go to the site and click "Play" audio output. when I type something in the search and get new tracks - it does not work. how come? src in the right path, in the console errors do not get

Answer 1

As answered privately angular-media-player is built natively around playlists, and is not designed to have many directives in one page (events collide as they are name-based and bad stuff happens).

Most straightforward approach is build a playlist comprising all the songs in your page, then just use ng-click="mediaPlayer.playPause($index)" inside the ng-repeat loop.