AngularJS Cordova Media不;不要总是播放下一首歌

AngularJS Cordova Media Doesn't Always Play Next Song

本文关键字：一首 放下 Media Cordova AngularJS 播放      更新时间：2023-09-26

我正在使用带有AngularJS和ngCordova媒体插件的Ionic框架：http://ngcordova.com/docs/plugins/media/

我的控制器目前有两个功能；

  1. 播放-此功能播放所选媒体src

      $scope.play = function(src) {
        media = $cordovaMedia2.newMedia(src, null, null, mediaStatusCallback);
        media.play(); 
        $scope.isPlaying = true;
        $ionicLoading.hide();
    }
  }

  2. Next Song-此函数通过查找当前歌曲对象的索引并选择列表中的下一个对象来获取列表中下一首歌曲的src。

    $scope.nextSong = function (song_id) {
        var index = $scope.allsongs.indexOf(song_id);
        if(index >= 0 && index < $scope.allsongs.length - 1) {
           $scope.nextsongid = $scope.allsongs[index + 1]
           $scope.playMusic($scope.nextsongid);  //the playMusic function just looks up the src of the song and parses to the play function
        }
}

这是上面调用的playMusic功能：

    $scope.playMusic = function(music_id)
{
    myService.getSongInfo(music_id)
    .then(function(data){
      $scope.cursong = data.results;
      $scope.play($scope.cursong.src);
    });
};

在我的模板中，下一个按钮只是用当前歌曲ID:调用nextSong函数

<div class="next" ng-click="nextSong('{{cursong.id}}')"></div>

我面临的问题是，当我第一次按下下一个按钮时，它会播放下一首歌，但当我再次按下它时，它又会播放同一首歌。"currssong"值似乎没有更新。

这就是"allsongs"数组的样子：

["1631922", "1502059", "1365874", "1607940", "1251204", "1233296", "1151847", "1119737", "1086438", "1078140", "1068172", "1065312", "845339", "799161", "316293", "306073", "299817", "1603940"]

更新：我尝试使用间隔

我有一个音程函数，当时间达到持续时间时，它会跳到下一首歌。我在那里调用nextsong函数，它工作得很好。

    $scope.Timer = $interval(function () {
$scope.cursongduration = $scope.cursong.duration;
$scope.cursongid = $scope.cursong.id;

if($scope.currduration >= $scope.cursongduration){
    $scope.nextSong($scope.cursongid);
    }, 1000);
};

所以我的问题是，为什么通过模板按钮调用nextSong也有效？在我看来，由于某种奇怪的原因，cursong.id在模板中1次后似乎没有更新。我也尝试过使用cursongid变量，它设置在模板按钮的间隔中，但没有成功：

<div class="next" ng-click="nextSong('{{cursongid}}')"></div>

问题不在cordova或媒体插件中，当你播放歌曲时，你必须更新$scope.cursong.id，这样下次点击就能知道当前歌曲是什么。

$scope.play = function(src) {
        $scope.cursong.id = src;
        media = $cordovaMedia2.newMedia(src, null, null, mediaStatusCallback);
        media.play(); 
        $scope.isPlaying = true;
        $ionicLoading.hide();
    }
  }

我假设您已经在脚本中的某个位置声明了$scope.cursong.id。

我通过创建一个新函数"PlayNextSong"解决了这个问题，该函数将$scope.cursong.id存储到一个新的作用域"cursongid"中，然后调用nextSong函数。这对我来说效果很好。

功能：

$scope.playNextSong = function() {
    $scope.cursongid = $scope.cursong.id;
    $scope.nextSong($scope.cursongid);
}

按钮：

<div class="next" ng-click="playNextSong()"></div>
相关文章：