如果想在controller里面随时监听一个值的变化那就用$watch
<label><strong>$watch:</strong></label> |
<input type= "text" ng-model= "name" /> |
$scope.$watch( "name" , function (newVal,oldVal){ |
console.log( "new:" +newVal, "old:" +oldVal) |
以上代码实现监听name属性值的变化,但是有个缺点假如要监听很多个属性值,就要写很多个$watch
为了解决上面的问题,可以使用$watchGroup,这个监听器是把多个属性使用数组的形式作为第一个参数传入
<p style= "margin-top: 20px" > |
<label><strong>$watchGroup:</strong></label> |
<input type= "text" ng-model= "one" /> |
<label><strong>$watchGroup:</strong></label> |
<input type= "text" ng-model= "two" /> |
$scope.$watchGroup([ "one" , "two" ], function (newVal,oldVal) { |
console.log( "new:" +newVal, "old:" +oldVal); |
$watchCollection是为一堆数据进行监听
<p style= "margin-top: 20px" ><strong>$watchCollection:</strong></p> |
<li ng-repeat= "d in lang" >{{d}}</li> |
$scope.lang = [ 'C/C++' , 'Java' , 'C#' , 'Python' ]; |
$scope.$watchCollection( 'lang' , function (newVal, oldVal) { |
console.log( "new:" +newVal, "old:" +oldVal) |
现在可以做个测试,使用$timeout二秒后发生变化
$scope.lang = [ 'JavaScript' , 'Html5' , 'Css3' , 'Angularjs' ]; |
点击查看完整代码 http://jsbin.com/kopazu/edit?html,css,js,output