Question

<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的更新？ ng-click和事件处理程序都会调用相同的函数来继续。这对我来说很安静。

Answer 1

事件处理程序在Angular的“外部”运行，因此Angular不知道对items的更改，因此ng-repeat不会重新呈现。致电s.$apply()以使Angular运行digest cycle，这将更新您的观点。

使用ng-click，会自动调用scope.$apply()。

click事件处理程序和ngClick指令之间有什么区别？

1 个答案: