如何在angularjs中观察此变量

Question

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

这是我试过的。

在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

您需要先绑定使用angular.bind

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

或场所内的观察者，而不是字符串&将得到每个评价消化周期

功能 this上下文的角度 $scope

$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

，这里是我对你的plunker的叉：

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;  
}); 

这是一个有趣的情况，其中的范围可以帮助不仅通过使手表顺利callable，而且也容易从我引用nside watch功能（$ scope.watch）。