AngularJS $watch 不适用于对象答案

【问题标题】：AngularJS $watch not working into objectAngularJS $watch 不适用于对象
【发布时间】：2015-01-06 18:47:53
【问题描述】：

将作品放置在数组中的元素上时，我无法观看；

<div ng-app>
    <div ng-controller="Test">
        Name: <input type="text" ng-model="customer.name" />
        <hr/>
        <div ng-repeat="address in customer.addresses">
            <input type="text" ng-model="address.name" />
            <input type="text" ng-model="address.zipcode" />
            <hr />
        </div>
    </div>
</div>

function Test($scope){
    $scope.customer = {
        name: 'Customer 1',
        addresses: [
            { name: 'Address 1', zipcode: 123456, city: null, state: null },
            { name: 'Address 2', zipcode: 234567, city: null, state: null },
            { name: 'Address 3', zipcode: 456787, city: null, state: null },
            { name: 'Address 4', zipcode: 675684, city: null, state: null }
        ]
    };    

    $scope.$watch('customer.name', function(newName, oldName){
        console.log(newName);
    });

    $scope.$watch('address.zipcode', function(newCode, oldCode){
        console.log(newCode);
        //Make request to webservice, get addres for zipcode set city and state from this address.
    });
}

客户的名字我可以，因为地址数组不起作用。

【问题讨论】：

您的地址是客户的成员，因此您需要使用customer.addresses。不过，我不知道您是否可以查看数组的特定索引。
$watch an object in angular的可能重复
@Jeyp 我无法观看整个对象。我只需要知道邮政编码。如果这个人改变了他的住所号码，那么对象就会改变。所以只需要知道邮编改了就行了。
好吧，好吧。然后我建议另一种方法。为什么不在该字段上使用更改侦听器并相应地更新其他值？这似乎是某种自动完成功能，您通常通过对文本字段上的更改事件做出反应来执行此操作。
为什么你不使用 ng-change 指令。

标签： javascript angularjs undefined watch

【解决方案1】：

您可以使用此解决方法。即：添加多个手表，但最好使用 ng-change which @Petr 上面已经解释过了

您正面临这个问题，因为 ng-repeat 有它自己的隔离范围，超出了您当前 $scope 的范围。

for (var i = 0; i < $scope.customer.addresses.length; i++) {
    $scope.$watch('customer.addresses[' + i + ']',function(newValue, oldValue) {
        console.log(newValue.zipcode + ":::" + oldValue.zipcode);
    }, true);
}

【讨论】：

【解决方案2】：

Ng-repeat 有自己的范围，所以你不能在外面写 'address.zipcode'。（我的意思是，你可以写，但这将解决另一个变量）你可以写：

$scope.$watch('customer.addresses[0].zipcode', function(newCode, oldCode){
    console.log(newCode);
});

所有索引都相同...但正如之前所说，最好使用 ng-change。 http://jsfiddle.net/qnb5aL1p/

【讨论】：

【解决方案3】：

尝试这样做：

$scope.$watch('customer.addresses', function(newCode, oldCode){
    for (... every address in customer.addresses) {
        // check if city and state are null and do the request if it is true
    }
}, true);

别忘了打开深度手表开关。（第三个参数true）该开关启用检查女巫angular.equals 而不是比较引用，这会导致您的数组被监视其元素的变化。

【讨论】：

这不会按我需要的方式工作。我需要它来仅监控邮政编码并将新的邮政编码返回给我
你能用英文写吗？
查看我将在何处使用它的示例。 prntscr.com/54xbhp 我有几个取决于邮政编码的元素；但是，可以更改参考字段，而无需监视器重做请求。因此，仅在更改 zip 时才发出请求很重要；
是的，你应该使用ngChange。我建议您在问题的第二条评论中使用更改侦听器...