码迷,mamicode.com
首页 > 移动开发 > 详细

angularJS--apply() 和digest()方法

时间:2015-08-04 22:43:57      阅读:145      评论:0      收藏:0      [点我收藏+]

标签:

$apply()$digest()AngularJS中是两个核心概念,但是有时候它们又让人困惑。而为了了解AngularJS的工作方式,首先需要了解$apply()$digest()是如何工作的。这篇文章旨在解释$apply()$digest()是什么,以及在日常的编码中如何应用它们。

 

探索$apply()$digest()

AngularJS提供了一个非常酷的特性叫做双向数据绑定(Two-way Data Binding),这个特性大大简化了我们的代码编写方式。数据绑定意味着当View中有任何数据发生了变化,那么这个变化也会自动地反馈到scope的数据上,也即意味着scope模型会自动地更新。类似地,当scope模型发生变化时,view中的数据也会更新到最新的值。那么AngularJS是如何做到这一点的呢?当你写下表达式如{{ aModel }}时,AngularJS在幕后会为你在scope模型上设置一个watcher,它用来在数据发生变化的时候更新view。这里的watcher和你会在AngularJS中设置的watcher是一样的:

 

<!DOCTYPE html>
<html >
<head>
    <meta  charset="utf-8">
    <title>$scope下的apply()和digest()方法</title>
    <script src="../js/angularjs.js"></script>
    <script src="../js/index6.js"></script>

</head>
<body>



    <div ng-app="" ng-controller="firstController">
        {{date}}
    </div>


</body>
</html>
var firstController=function($scope){
     $scope.date=new Date();
/*    setInterval(function(){
        // 这里虽然触发了时间,但是并没有进行脏检查。可以通过apply()方法;
        $scope.date = new Date();
        },1000);*/
    //上述操作被没有触发一秒钟更新一次date.要改变===》
    // 要么用set方法,要么用脏检查。以ng-开头的都会进行脏检查。

    setInterval(function(){
        $scope.$apply(function(){
            $scope.date = new Date();
        });
    },1000)
    /*    <!-- $scope.$apply()方法可以在angular框架之外执行angular JS
表达式 如:DOM时间、setTimeout、XHR或第三方库-->*/

}

我希望这篇文章解释清楚了$apply$digest。需要记住的最重要的是AngularJS是否能检测到你对于model的修改。如果它不能检测到,那么你就需要手动地调用$apply()

angularJS--apply() 和digest()方法

标签:

原文地址:http://www.cnblogs.com/gpxiao/p/4703270.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!