angular内置了
有些情况下,模型数据修改之后許他要我们手动调用
<!DOCTYPE html>
<html lang="en" ng-app="msgMoudle">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../../angular.min.js"></script>
</head>
<body>
<div ng-controller="MsgController">
<button ng-click="scheduleTtask()">3秒后回显消息</button>
<div>{{message}}</div>
</div>
<script>
var msgMoudle=angular.module('msgMoudle',[]);
msgMoudle.controller('MsgController',function ($scope) {
$scope.scheduleTtask=function () {
setTimeout(function () {
// 在setTimeout()内部使用$apply方法
$scope.$apply(function(){
$scope.message='信息内容';
console.log('messeage='+$scope.message);
})
},3000)
}
})
</script>
</body>
</html>
也就是说,当我们每次使用setTimeoit()和setInterval()方法时,都有手动去出发$digest方法,显得有点麻烦,因此框架给我们提供了两个相同功能的服务
- $timeout()
- $interval()
<!DOCTYPE html>
<html lang="en" ng-app="msgMoudle">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../../angular.min.js"></script>
</head>
<body>
<div ng-controller="MsgController">
<button ng-click="scheduleTtask()">3秒后回显消息</button>
<div>{{message}}</div>
</div>
<script>
var msgMoudle=angular.module('msgMoudle',[]);
// 需要先在此处传入$timeout参数
msgMoudle.controller('MsgController',function ($scope,$timeout) {
$scope.scheduleTtask=function () {
$timeout(function () {
$scope.message='信息内容';
console.log('messeage='+$scope.message);
},3000)
}
})
</script>
</body>
</html>