2013-10-29 39 views
1

我想用角度$ watch觀看kendo multiselect值更改,但不起作用。 我的代碼有什麼問題。我該如何解決它?Angular Kendo UI多選手錶無法正常工作

代碼如下(或jsbin

值的變化秒錶第一調用之後。

<body ng-app="myapp"> 
     <div ng-controller="mycontroller"> 
    ValueA :{{ ValueA }} , Change count: {{ valueAChangeCnt }}<br /> 

      <div multiple="multiple" 
       kendo-multi-select 
       data-placeholder="Select attendees..." 
       k-data-text-field = "'name'", 
       k-data-value-field = "'index'", 
       k-data-source='dsA' 
       ng-model='ValueA' 
      > 
      </div> 
    <br /> 
    <br /> 
    ValueB :{{ ValueB }} , Change count: {{ valueBChangeCnt }}<br /> 
    <br /> 
     <select ng-model="ValueB"> 
      <option value="1">A</option> 
      <option value="2">B</option> 
      <option value="3">C</option> 
      <option value="4">D</option> 
      <option value="5">E</option> 
      <option value="6">F</option> 
     </select> 
     </div> 
    </body> 

<script type="text/javascript"> 
    var MyApp = angular.module('myapp', ['kendo.directives']); 

    function mycontroller($scope) { 

     $scope.dsA = new kendo.data.DataSource({ 
      data: [ 
       { name: "A", index: 1 }, 
       { name: "B", index: 2 }, 
       { name: "C", index: 3 }, 
       { name: "D", index: 4 }, 
       { name: "E", index: 5 }, 
       { name: "F", index: 6 } 
      ] 
     }); 
     $scope.valueAChangeCnt = 0; 
     $scope.$watch('ValueA', function() { 
      console.log('ValueA Changed'); 
      $scope.valueAChangeCnt++; 
     }); 

     $scope.valueBChangeCnt = 0; 
     $scope.$watch('ValueB', function() { 
      console.log('ValueB Changed'); 
      $scope.valueBChangeCnt++; 
     }); 

    } 

    mycontroller.$inject = ['$scope']; 
</script> 

回答

2

插入true$watch監聽功能:

$scope.$watch('ValueA', function() { 
     console.log('ValueA Changed'); 
     $scope.valueAChangeCnt++; 
    }, true); 

這將比較對象的平等,而不是供參考。 From AngularJS API

+0

非常感謝。 – mrhihi