1

angular $watch で kendo multiselect の値の変化を見たいのですが、うまくいきません。私のコードに何か問題がありますか。どうすれば修正できますか?

次のようなコード (またはjsbin )

値 A は、最初の呼び出し後にストップ ウォッチを変更します。

    <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>
4

1 に答える 1