您的位置：首页 > Web前端 > AngularJS

AngularJS入门3-小例子-定时器

2014-10-29 15:46 162 查看

实现效果：

实现代码：

<!DOCTYPE HTML>
<html ng-app="">
<head><script src="./angular.min.js"></script></head>
<body>
<h1>定时器对象</h1>
<div ng-controller="ClockController">
<h5>time: {{clock}}</h5>
</div>
<script type="text/javascript">
function ClockController($scope, $timeout) {
var updateClock = function(){
$scope.clock = new Date();
$timeout(function(){
updateClock();
},1000);
};
updateClock();
}
</script>
</body>
</html>

改进写法(最佳实践：在视图中通过对象属性而非对象本身来进行引用绑定，是angular中的最佳实践)：

function ClockController($scope) {
$scope.clock ={
now: new Date()
};
var updateClock = function(){
$scope.clock.now = new Date();
};
setInterval(function(){
$scope.$apply(updateClock);
},1000);

updateClock();
}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航