AngularJS 通知angular(视图)进行数据更新($scope.$apply())

最新推荐文章于 2020-12-21 08:19:16 发布

houyanhua1

最新推荐文章于 2020-12-21 08:19:16 发布

阅读量4k

点赞数

分类专栏： AngularJS 文章标签： angular angularjs apply

本文链接：https://blog.csdn.net/houyanhua1/article/details/80245777

版权

AngularJS 专栏收录该内容

30 篇文章 0 订阅

订阅专栏

demo.html：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body ng-app="App">
	<div ng-controller='DemoController'>
		<p ng-cloak>{{time}}</p>
		<p ng-cloak>{{time2}}</p>
	</div>

	<script src="angular.min.js"></script>  <!-- 引入AngularJS框架 --> 
	<script>
        var App = angular.module('App',[]);    
    
        App.controller("DemoController",['$scope','$interval',function($scope,$interval) {

        	$scope.time = new Date;
        	$scope.time2 = new Date;

        	// DOM原生的setInterval()函数
            setInterval(function() {
            	$scope.time = new Date;
            	// 通知angular进行数据更新。
            	$scope.$apply(); // DOM原生setInterval()函数需要手动通知数据更新。
            },1000);

            // Angular自带的$interval函数,可以自动进行数据更新
            // $interval(function() {
            // 	$scope.time2 = new Date;
            // },1000);
        }]);   
	</script>
</body>
</html>