AngularJs基本應用程序執行兩次

我做了很多測試，它返回相同的結果，它可以影響我的應用程序？

<html ng-app="todoApp"> 
 
    <head> 
 
\t <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script> 
 
\t <script> 
 
\t "use strict"; 
 
    angular.module('todoApp', []) 
 
     .controller('TodoListController', function() { 
 
     var todoList = this; 
 
\t \t var i = 0; 
 
     
 
     todoList.addTodo = function() { 
 
      console.log(1) 
 
\t \t \t i++; 
 
\t \t \t // return i it breaks the script 
 
     }; 
 
     }); 
 
\t </script> 
 
    </head> 
 
    <body ng-controller="TodoListController as todoList"> 
 
\t {{todoList.addTodo()}} 
 
    </body> 
 
</html>

來源

2016-02-24 FeeFez

這是與角消化週期的問題。 addTodo()將按照該循環運行的頻率執行，從1到幾次迭代都會執行。在您的Angular模板表達式（{{}}）中，綁定到範圍變量，而不是函數，除非您知道自己在做什麼（即只綁定到冪等getter函數），您可以將其綁定到範圍變量，而不是其他函數。並計算控制器中這些變量的值。像這樣：

<html ng-app="todoApp"> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script> 
    <script> 
    "use strict"; 
    angular.module('todoApp', []) 
     .controller('TodoListController', function() { 
     var todoList = this; 
     var i = 0; 

     todoList.addTodo = function() { 
      console.log(1) 
      i++; 
      return i; 
     }; 

     todoList.todo = todoList.addTodo(); 
     }); 
    </script> 
    </head> 
    <body ng-controller="TodoListController as todoList"> 
    {{todoList.todo}} 
    </body> 
</html>

來源

2016-02-24 14:48:37

你的控制器沒有執行兩次，你的函數addTodo被執行兩次。發生這種情況的原因是角度呈現兩次。

閱讀角度$watch爲underestand爲什麼{{}}被執行兩次。

後一位守望與範圍登記，聽者FN是異步調用（通過$ evalAsync）來初始化觀察者。在極少的情況下，這是不受歡迎的，因爲當watchExpression的結果沒有改變時調用監聽器。要在偵聽器fn中檢測此場景，可以比較newVal和oldVal。如果這兩個值是相同的（===），那麼聽者被稱爲初始化。

來源

2016-02-24 14:52:35 Serginho

AngularJs基本應用程序執行兩次

回答

相關問題