Angular JS - 從控制器指令中進行的更改

Question

我試圖$監視指令作用域中發生的更改，並將對象添加到數組（如果已更改）。編輯功能位於指令作用域中，但保存功能位於指令作用域之外，即從控制器作用域調用保存。我正在使用共享對象來使用雙向綁定來訪問已在指令作用域中編輯的對象。編輯被正確保存，但我需要篩選出任何未被更改的對象。我不明白爲什麼這些更改沒有反映在$ watch中。

//控制器

vm.accessor = {}; 
getGlobalConfigs(); 
$scope.$watch('vm.accessor.globalConfigs', function(newValue, oldValue) { 
    console.log('config changed'); 
}); 
function getGlobalConfigs() { 
    vehicleConfigurationsFactory.getGlobalConfigs() 
    .then(function (data) { 
     vm.accessor.globalConfigs = data; 
    }); 
} 

//指令

(function(){ 
'use strict'; 

angular.module('vehicleConfigurationsModule') 
.directive('globalConfig', globalConfig); 

    function globalConfig() { 

    var directive = { 
     link: link, 
     replace: false, 
     templateUrl: 'app/vehicle-configurations/global-config-tr.html', 
     scope: { 
      confkey: '@', 
      confvalue: '=', 
      confprecedence: '=', 
      confdescription: '=', 
      accessor: '=' 
     } 
    } 

    return directive; 

    function link(scope, el, attrs, controller) { 
     scope.master = { 
     confvalue: scope.confvalue, 
     confprecedence: scope.confprecedence, 
     confdescription: scope.confdescription 
     }; 
     scope.disabled = true; 
     scope.precedenceOptions = [ 
     {value: "GLOBAL"}, 
     {value: "VEHICLE"} 
     ]; 
     scope.selectedOption = {value: scope.confprecedence}; 
     scope.edit = function() { 
     scope.disabled = false; 
     scope.accessor.disabled = false; 
     }; 
     scope.cancel = function() { 
     scope.disabled = true; 
     scope.accessor.disabled = true; 
     scope.confvalue = scope.master.confvalue; 
     scope.confprecedence = scope.master.confprecedence; 
     scope.confdescription = scope.master.confdescription; 
     }; 
     scope.setPrecedence = function(value) { 
     scope.confprecedence = value; 
     }; 
    } 

} 


})(); 

//指令例如

<tr ng-repeat="config in vm.accessor.globalConfigs" global-config confkey="{{ config.confKey }}" confvalue="config.confValue" confprecedence="config.precedence" confdescription="config.description" accessor="vm.accessor"></tr> 

//指令模板

<td ng-model="config.confKey">{{ confkey }}</td> 
<td> 
    <input type="text" class="form-control" ng-model="confvalue" ng-disabled="disabled"> 
</td> 
<td> 
    <select class="form-control" ng-options="option.value for option in precedenceOptions track by option.value" 
ng-model="selectedOption" ng-disabled="disabled" ng-change="setPrecedence(selectedOption.value)"></select> 
</td> 
<td> 
    <input type="text" class="form-control" ng-model="confdescription" ng-disabled="disabled"> 
</td> 
<td> 
    <a ng-show="disabled" role="button" translate="{{ 'vehicle-configurations.edit' }}" ng-click="edit()"></a> 
    <a ng-show="!disabled" role="button" translate="{{ 'vehicle-configurations.cancel' }}" ng-click="cancel()"></a> 
</td> 

Answer 1

這似乎是一種奇怪的方式做到這一點，但是我覺得你只需要告訴你的手錶表內globalConfigs的對象是這樣的：

$scope.$watch('vm.accessor.globalConfigs', function(newValue, oldValue) { 
    console.log('config changed'); 
},true); 

注意第三個參數去$看」，真「它告訴手錶」深入觀察「。