标签:时间 style play 控制 -- 回调函数 不显示 one imp
media.addEventListener(‘timeupdate‘, function() {//监听视频播放时间 if(media.currentTime>1){//如果视频播时间超过1秒 $scope.scoreShow=true;//打分框弹出
console.log($scope.scoreShow);//true };
},true);
给一个视频 media 对象添加监听事件: timeupdate 时,回调函数正常执行,$scope.scoreShow也变成了true,但是在html页面上
<!--打分弹框-->
<div class="videoMessage" ng-show="scoreShow"> <p>打个分,留下你的态度!</p> <p class="btns"> <span ng-click="confirmScore()">确定</span> <span ng-click="ignoreScore()">无视</span> </p> </div>
视频播放到1秒以后,打分弹框始终不显示,而且在页面的控制台去看打分弹框,display:none!important;
说明$scope.scoreShow事实上没有起作用。
很奇怪的一点是:
如果在同一个controller中有一行:$interval(function(){},0);
如下
media.addEventListener(‘timeupdate‘, function() {//监听视频播放时间
if(media.currentTime>1){//如果视频播时间超过1秒
$scope.scoreShow=true;//打分框弹出
console.log($scope.scoreShow);//true
};
},true);
$interval(function(){},0);
打分弹框就会显示。
但是如果把$interval 换成原生代码setInterval , 打分弹框也不会显示。
***** 重点:
因此,推断:因为ionic不知道原生代码做了一些事情,所以不知道$scope.scoreShow改变了,要ionic知道需要用到$scope.$apply()把$scope.scoreShow=true包起来:
media.addEventListener(‘timeupdate‘, function() {//监听视频播放时间 if(media.currentTime>1){//如果视频播时间超过1秒 $scope.$apply(function(){ $scope.scoreShow=true;//打分框弹出 }); }; },true);
这样$scope.scoreShow不只是变成了true,还真正起到作用了,打分弹框显示了。
备注 :
引用 http://www.2cto.com/kf/201311/256848.html 里的一段话来解释:什么时候用$apply()
标签:时间 style play 控制 -- 回调函数 不显示 one imp
原文地址:http://www.cnblogs.com/cao-zhen/p/6668063.html