Angular $ watch不工作？

Question

Angular $ watch不工作？

以下代码仅在最初加载页面时记录.怎么了？

<!DOCTYPE html>
<html ng-app>
    <head>
        <title>Test</title>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js"></script>
    </head>
    <body>
        <div ng-controller="PageController">
            <p ng-bind="model.header"></p>
            <p>Value: <input ng-model="model.header" /></p>
        </div>
        <script>
            function PageController($scope) {
                $scope.model = {};
                $scope.model.header = 'Header';

                $scope.onModelChange = function (newValue, oldValue, scope) {
                    console.log('model changed > newValue: ' + newValue + ' > oldValue: ' + oldValue);
                };

                $scope.$watch($scope.model, $scope.onModelChange, true);
            }
        </script>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Flo*_*n F 14

$ watch的第一个参数应该是scope属性本身

$scope.$watch("model", $scope.onModelChange);

Run Code Online (Sandbox Code Playgroud)

而且您不需要在此属性上启用深度监视(第三个参数)

Answer 2

Cra*_*ire 5

正如Florian F所提到的,第一个参数是您想要观察的范围属性的字符串.

$scope.$watch("model", $scope.onModelChange, true);

Run Code Online (Sandbox Code Playgroud)

但是,当您正在观察对model.header的更改时,需要设置"deep"参数.如果不是,则只有在更新模型对象引用本身时才会触发监视.

这是一个显示浅表和深表的plunkr,浅表不起作用,因为它只是观看模型对象参考. http://plnkr.co/edit/ejMc2pBjIFD9aX6PBsY1

归档时间：	12 年，1 月前
查看次数：	13299 次
最近记录：	9 年，8 月前