2013-04-27 4 views
2
<html ng-app> 
<head> 
    <script language="javascript" src="./angular-1.0.6/angular.js"></script> 
    <script language="javascript"> 
     function scopeReady(s) { 
      document.getElementById("btn").addEventListener("click", function(event) { 
       alert(s.items); 
       s.btnClick(); 
       alert(s.items); 
      }); 
     } 

     function ctrl($scope) { 
      $scope.items = ["abc", "def", "ghi"]; 
      $scope.btnClick = function() { 
       $scope.items.push("one more"); 
      }; 
      scopeReady($scope); 
     } 
    </script> 
</head> 
<body ng-controller="ctrl"> 
<li ng-repeat="item in items">{{item}}</li> 
<button id="btn">Event Handler</button> 
<button ng-click="btnClick()">Angular ngClick</button> 
</body> 
</html> 

Как показывает фрагмент кода, почему нажатие первой кнопки не вызывает обновление DOM? И нг-клик, и обработчик событий вызывают одну и ту же функцию. Это меня смущает.В чем разница между обработчиком событий click и директивой ngClick?

ответ

4

Обработчики событий запускают «снаружи» Углового, поэтому Угловой не знает об изменении на items, поэтому ng-repeat не перерисовывает. Вызовите s.$apply(), чтобы вызвать Angular для запуска digest cycle, который обновит ваше представление.

С ng-click, scope.$apply() вызывается автоматически.

Смежные вопросы