【问题标题】:AngularJS Cordova Media Doesn't Always Play Next SongAngularJS Cordova Media 并不总是播放下一首歌曲
【发布时间】:2015-11-15 11:52:22
【问题描述】:

我正在使用带有 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. 下一首歌曲 - 该函数通过查找当前歌曲对象的索引并选择列表中的下一首对象来获取列表中下一首歌曲的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>

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

这是“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>

【问题讨论】:

    标签: javascript angularjs cordova ionic-framework


    【解决方案1】:

    问题不在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

    【讨论】:

    • 这是在 playMusic 函数中完成的,$scope.cursong 会更新有关歌曲的信息,包括它的 id 和 src。请参阅 playMusic 代码的更新问题。
    • 你能分享一些“data.results”返回的例子
    • 对象 { id: 1251204, status: "complete", stream_only: "yes"} streaming_url: "cloudfrontlink"
    • 我面临的问题是,当我第一次按下下一个按钮时,它会播放下一首歌曲,但当我再次按下它时,它会再次播放同一首歌曲。 'currsong' 值似乎在第二次之后没有更新。
    • 尝试在nextSong函数中使用这一行var index = $scope.allsongs.indexOf(String(song_id));
    【解决方案2】:

    我通过创建一个新函数“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>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多