1、setTimeout的用法
<script src="angular-1.6.8/angular.js"></script>
<body ng-app="myApp" ng-controller="myController">
<input type="button" ng-click="touch()" value="三秒后显示水利"/>
{{message}}
<script>
var app = angular.module("myApp",[]);
app.controller("myController",function($scope){
$scope.touch = function(){
setTimeout(function(){
$scope.$apply(function(){
$scope.message = "水利";
});
},3000);
}
});
</script>
</body>
2、setInterval的用法
<script src="angular-1.6.8/angular.js"></script>
<body ng-app="myApp" ng-controller="myController">
<input type="button" ng-click="touch()" value="三秒后显示水利"/>
{{message}}
<script>
var app = angular.module("myApp",[]);
app.controller("myController",function($scope){
$scope.touch = function(){
var count = 0;
setInterval(function(){
$scope.$apply(function(){
$scope.message = "水利"+count++;
});
},3000);
}
});
</script>
</body>
3、$timeout的用法
话不多说,先贴一段代码
<script src="angular-1.6.8/angular.js"></script>
<body ng-app="myApp" ng-controller="myContr">
<input type="button" ng-click="touch()" value="显示"/>
{{gx}}
<script>
var app = angular.module("myApp",[]);
app.controller("myContr",function($scope,$timeout){
$scope.touch = function(){
$timeout(function(){
$scope.gx = "水利";
},3000);
}
});
</script>
</body>
4.$interval的使用
话不多说,贴代码
<script src="angular-1.6.8/angular.js"></script>
<body ng-app="myApp" ng-controller="myContr">
{{date}}
<script>
var app = angular.module("myApp",[]);
app.controller("myContr",function($scope,$interval){
$interval(function(){
$scope.date = new Date();
},1000);
});
</script>
</body>
注意:我因为要在里边用$timeout,所以就将$timeout先传进去:
app.controller("控制器名称",function($scope,$timeout){});
angular.js的$timeout指令对window.setTimeout做了一个封装,它的返回值是一个promise对象.当定义的时间到了以后,这个promise对象就会被resolve,回调函数就会被执行.
如果需要取消一个timeout,调用$timeout.cancel(promise)方法.
用法:
$timeout(fn, [delay], [invokeApply]);
fn: 回调函数(必填)
delay: number类型.延迟的时间(非必填),如果不填,表示等线程空下来以后就执行.比如当页面被渲染完成后.
invokeApply: 布尔值.是否需要进行脏值检测(非必填),不填默认为false,如果设置为true,则fn回调会被包在$scope.$apply()中执行
返回值: 返回一个promise对象.当定义的时间到了以后,这个promise对象就会被resolve.resolve的值就是fn回调函数的返回值
初学angular js,有错误之处还请大神指出