Функция триггера при изменении значения свойства массива объектов

Question

Ниже приведен образец моего массива объектов.

$scope.arr = [{"A":"a","B":"b"},{"A":"c","B":"d"},{"A":"e","B":"f"},{"A":"g","B":"h"}]; 

Теперь я хочу вызвать функцию, когда значение свойства «А» изменяется. В принципе, чтобы получить счетчик «А» с , не пуст значение. Ниже приведены сценарии выборки.

• Если значение «А» изменено для вновь добавленного объекта в массив.
• Если объект удален, когда свойство «A» содержит значение.
• Если значение добавляется к пустому «А» в объекте
• Если текущее значение опустели «А» в объекте

Я прошел через Угловую документацию часов и является возможным решением. Но моя проблема заключается в том, как наблюдать за конкретным свойством («A») в любым объектом массива.

Цените любую помощь для этого.

Если в Angular нет возможных решений, есть ли альтернативные решения с underscore.js?

Answer 1

Это можно сделать, используя $watch.

.: например

$scope.$watch("arr",function (newVal,oldVal){ 
    angular.forEach(newVal,function (val,index){ 
     if(oldVal.indexOf(val)== -1){ 
       //your code 
       } 
     }) 

},true); 

Вот третий аргумент 'true' для глубокой проверки.

Answer 2

Для AngularJS, есть $scope.$watch:

$scope.$watch("arr",function (newVal,oldVal){ 
    console.log("value has changed from "+oldVal+" to "+newVal); 
},true); 

Но это супер дорого.

Для ванильного Javascript, вот нестандартная реализация называется object.watch заимствовано из here

/* 
* object.watch polyfill 
* 
* 2012-04-03 
* 
* By Eli Grey, http://eligrey.com 
* Public Domain. 
* NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK. 
*/ 

// object.watch 
if (!Object.prototype.watch) { 
    Object.defineProperty(Object.prototype, "watch", { 
      enumerable: false 
     , configurable: true 
     , writable: false 
     , value: function (prop, handler) { 
      var 
       oldval = this[prop] 
      , newval = oldval 
      , getter = function() { 
       return newval; 
      } 
      , setter = function (val) { 
       oldval = newval; 
       return newval = handler.call(this, prop, oldval, val); 
      } 
      ; 

      if (delete this[prop]) { // can't watch constants 
       Object.defineProperty(this, prop, { 
         get: getter 
        , set: setter 
        , enumerable: true 
        , configurable: true 
       }); 
      } 
     } 
    }); 
} 

// object.unwatch 
if (!Object.prototype.unwatch) { 
    Object.defineProperty(Object.prototype, "unwatch", { 
      enumerable: false 
     , configurable: true 
     , writable: false 
     , value: function (prop) { 
      var val = this[prop]; 
      delete this[prop]; // remove accessors 
      this[prop] = val; 
     } 
    }); 
}