好的,我有以下HTML:
.
为此,我有以下控制器代码:
<timer countdown="30" interval="1000">
{{seconds}}
percent
</timer>
{{timerSeconds}}
但是视图$scope.timerRunning = true;
$scope.timerSeconds = 100;
$scope.$on('timer-tick',function(e, val) {
$scope.timerSeconds = (Math.floor(val.millis / 1000) / 30 * 100);
});
未更新。我通过调试验证了事件,发现它正在执行函数并更改timerSeconds
值。
答案 0 :(得分:3)
这一行之后:
$scope.timerSeconds = (Math.floor(val.millis / 1000) / 30 * 100);
添加
$scope.apply();
以便AngularJS检查模型是否有变化并重新渲染它们。
在许多情况下,AngularJS无法进行模型更改,尤其是在 Asynch 函数中,例如$on()
详细了解:When to use $scope.$apply()
如果它无效,请使用AngularJS $ timeout函数
$scope.$on('timer-tick',function(e, val) {
$timeout(function(){
$scope.timerSeconds = (Math.floor(val.millis / 1000) / 30 * 100);
})
});