angularjs - Angular js - 摘要循环

标签 angularjs angularjs-digest

我可能会尝试澄清我对摘要循环的概念。我有一个小的 HTML 页面:

<!doctype html>
<html>
    <head lang="en">
        <meta charset="utf-8"/>        
        <title>Practice</title>
    </head>
    <body ng-app="myApp">
        <div ng-controller="myController">
            Enter your text <br>
            <textarea rows="5" id="comments" ng-model="commentText"></textarea>
            <br>
            Type Char:{{ lenghtComment }}            
        </div>        
        <script src="https://code.angularjs.org/1.5.0-beta.2/angular.min.js" type="text/javascript"></script>
        <script src="prac.js" type="text/javascript"></script>
    </body>

</html>   

======================================== 小 angualr 文件为:

var myApp=angular.module("myApp",[]);
myApp.controller("myController",["$scope",function($scope){
    $scope.commentText="";
   /* $scope.lenghtComment=function(){
        return $scope.commentText.length;
    };*/

 $scope.lengthComment=$scope.commentText.length;

}]);

我想显示我在文本框中键入的字符数。虽然有很多方法可以做到这一点,但我想知道为什么上面的方法不起作用。范围变量“LenghtComment”依赖于“commentText”,因此摘要循环会在用户键入时检测“commentText”的更改,然后应在观察者列表上重复以确保是否有任何因变量发生更改。在此运行中,它应该找到“lenghtComment”变量中的更改并更新应用程序。但事实并非如此。但是,如果我使用评论中的函数,它的效果非常好。请指出我的理解中的差距。提前谢谢你们。

最佳答案

除了代码中的拼写错误之外,这将无法按照现在编写的方式工作。

Angular 不会在每个 $digest 周期不断重新运行您的 Controller 。相反,它创建监听器来监视变量的变化,并更新这些变量。

但是,在这种情况下,$scope.lengthComment 不会在每个 $digest 周期中发生变化。它可能看起来在变化,但实际上,$scope.commentText.length 是一个返回整数的赋值(在本例中为 0)。任务完成后,不会重新评估。在这种情况下,lengthComment 是一个原语,并且它依赖于commentText

相比之下,另一种形式$scope.lengthComment=function()不断变化。本例中的变量并未分配给函数的返回值,而是分配给函数本身。每个$digest,必须重新评估此函数以确定其结果是否相同。

关于angularjs - Angular js - 摘要循环,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34553051/

相关文章:

javascript - 如何从另一个 Controller 更新 Controller 的 ng-repeat 模型?

Angular 绑定(bind)到函数结果

javascript - Angular HTTP 请求渲染不同的 HTML

javascript - 如何从 Angular $http post 请求中获取 json 字符串

javascript - AngularJS:在页面初始加载时设置默认输入值

javascript - 理解这个 AngularJS 指令?

javascript - ng-repeat Angular 中每个数据有不同的表行

angularjs - 创建只能访问某些页面的子域别名

angularjs - 快速连续调用$ rootScope。$ apply()时,$ digest已经在进行中

angularjs - 向现有集合添加或修改对象时,ng-repeat within 指令不会更新