Question

我无法弄清楚如何在angularjs中观察绑定到此变量的变量。

这是我尝试过的。

in html，

<input type="text" ng-model="vm.text"/>--{{vm.text}}--
    <p>{{vm.count}} times changed</p>
    <input type="text" ng-model="text1"/>--{{text1}}--
    <p>{{count1}} times changed</p>

app.js中的

$scope.$watch('this.text', function() {
    console.log('watch 1');
    this.count=this.count+1;
});

$scope.$watch('text1', function() {
// do something here
   console.log('watch 2');
   $scope.count1=$scope.count1+1;
});

和plunker link也是如此。

我可以观看text1，但我无法观看text1。

任何人都可以解释一下如何观看text1吗？

提前致谢

Answer 1

您需要先使用this

将$scope上下文绑定到角度angular.bind

$scope.$watch(angular.bind(this, function () {
  return this.text;
}), function (newVal) {
  console.log('watch 1');
  this.count=this.count+1;
});

或者在观察者中放置一个函数而不是字符串＆amp;将在每个摘要周期进行评估

$scope.$watch(function () {
   return vm.text;
},function(value){
   console.log('watch 1');
   this.count=this.count+1;
});

Answer 2

您需要观看vm.text

http://plnkr.co/edit/ctDjs0dwe50kMu61TfCW?p=preview

$scope.$watch('vm.text', function() {
       console.log('watch 1');
             this.count=this.count+1;

   });

Answer 3

你在这里有一些不同的担忧。

您正在将$ scope.watch与控制器一起用作语法。这不是一个简单的文本，这里有一个关于它的精美文本：

http://www.bennadel.com/blog/2852-understanding-how-to-use-scope-watch-with-controller-as-in-angularjs.htm

这是我的狙击手的分叉：

http://plnkr.co/edit/ctDjs0dwe50kMu61TfCW?p=preview

我做的是：

/*make this (controller) callable 
 *from inside my watch function, 
 *so I can observe it and count can change
 */
var vm = this; 

//vm is observable as it is assigned
$scope.$watch(function (scope) {return vm.text;}, 


function() {
   console.log('watch 1');
  //count can change, as the controller is assigned to variable
   vm.count=vm.count+1;       
});

这是一个有趣的情况，其中范围不仅可以帮助使手表顺畅地调用，而且还可以通过内部监视功能（$ scope.watch）轻松引用。

如何在angularjs中观察这个变量

3 个答案: