Можно ли наблюдать за переменными контроллера, которые установлены вместо $ scope? Плохая идея

0

Я борюсь с концепцией this в угловой. Я читал различия, которые были очень хорошо объяснены в "этой" и "$ -области" в контроллерах AngularJS, но у меня все еще возникает вопрос, полезно ли это во многих случаях вообще.

Я создал контроллер и this.the_value var

angular.module("TheApp", [])
    .controller("TheCtrl", ["$scope", function($scope){
         this.the_value = "Init value";
}]);

Теперь мне нравится концепция здесь, так как я могу написать ng-controller="TheCtrl as myCtrl" и указать значение в представлении myCtrl.the_value. Я разделяю контексты при работе с вложенными контроллерами, это прекрасно.

Затем я понял, что мне нужно посмотреть эту переменную через $scope.$watch.

Теперь я либо должен переписать весь мой код представления, а вместо this переместить значение_значения в $scope чтобы я мог использовать

 $scope.$watch("the_value", function(newValue, old ){
        console.log("The old value: '"+old+"', the new value: '"+newValue+"'");
    });

или сделать некоторые неприятные вещи, как

   $scope.$watch("myCtrl.the_value", function(newValue, old ){
        console.log("This: The old value: '"+old+"', the new value: '"+newValue+"'");
    });

который является злом, поскольку я создаю зависимость от моего псевдонима представления имени контроллера. Если я реорганизую псевдоним вида, это сломается. (Даже модульное тестирование будет загрязнено этой зависимостью)

Имеет ли this очень ограниченное использование, или я получаю что-то неправильно? Везде, где я начал использовать this превратился в $scope когда добавлял новое поведение в код.

Теги:

2 ответа

1
Лучший ответ

Если вы используете это, вы можете наблюдать переменные первого уровня, передавая функцию в качестве первого параметра в $ scope. $ Watch

$scope.watch(

  function() {
    return this.the_value; //this is the real variable to be watched
  }.bind(this), //binding allows to use 'this' inside function

  function(newVal, oldVal) {
    console.log(newVal, oldVal); //this is the callback
  }

);
0

Легким решением для этого является просмотр функции, которая возвращает наблюдаемую переменную.

Обтекание переменной позволит вам использовать это и не требует использования псевдонима контроллера.

$scope.$watch(function() {
  return that.the_value

}, function(newValue, old) {
  console.log("This: The old value: '" + old + "', the new value: '" + newValue + "'");
});
  • 0
    @tarini отправил правильный ответ. У вас есть опечатка, вы используете это вместо этого, но даже с этим необходимо правильное связывание, чтобы пример работал.
  • 0
    Я объявил var that = this, чтобы избежать проблем с закрытием.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню