Używanie $ watch bez $ scope (kontroler jako składnia)

Question

W Angular 1.3 możliwe jest użycie this.foo='bar' insteaod z $scope.foo='bar'. Teraz, jak mogę użyć $watch bez $ scope?

Answer 1

Istnieje kilka opcji, aby uniknąć konieczności używania $watch podczas korzystania ze składni controller as.

Następujące przykłady pochodzą z blog post I wrote about avoiding $scope.

Korzystanie ng-change

Jeśli masz zegarek skonfigurować do nasłuchiwania zmian rzeczowych że pochodzi od pola formularza, a następnie NG-zmiana jest najlepszym.

<input type="text" ng-model="ctrl.name" ng-change="ctrl.search(ctrl.name)" /> 

MyCtrl.prototype.search = function(name){ 
    //call some service here 
}; 

Korzystanie Właściwości ES5

Jeśli masz jakąś właściwość, że nie jest związany z pola wejściowego, lub jest będzie aktualizowany z kodu, to może wydawać się zegarek to Twój jedyny wybór . Jeśli jednak nie musisz obsługiwać IE8 lub niższego poziomu, możesz użyć właściwości ES5, aby uruchomić funkcję, gdy coś zmieni się na kontrolerze.

var MyCtrl = function(){ 
    this._selectedItem = null; 
}; 

Object.defineProperty(MyCtrl.prototype, 
    "selectedItem", { 
    get: function() { 
     return this._selectedItem; 
    }, 
    set: function (newValue) { 
     this._selectedItem = newValue; 

     //Call method on update 
     this.onSelectedItemChange(this._selectedItem); 
    }, 
    enumerable: true, 
    configurable: true 
});