'ControllerAs'を使用するとエラーが発生しますが、ng-repeatチェックボックスで '$ scope'を使用するとうまく動作します

Question

'$ scope'構文を使用すると、個々のチェックボックスをオンにすると対応するオブジェクト名が正しく出力されますコードは、個々のチェックボックスをチェックすると、異常に

vm.users = [{....}] //Using 'Controller As' Syntax 
vm.selected = []; 

vm.exist = function(item) { 
    return vm.selected.indexOf(item) > -1; 
} 
vm.toggleSelection = function(item) { 
    var idx = vm.selected.indexOf(item); 
    if (idx > -1) { 
    vm.selected.splice(idx, 1); 
    } else { 
    vm.selected.push(item); 
    } 
} 

エラーがChromeデベロッパーツールで返されるエラーにControllerAsに使用して、上記のコードの

$scope.users = [{.....}] //using $scope syntax 
$scope.selected = []; 

$scope.exist = function(item) { 
    return $scope.selected.indexOf(item) > -1; 
} 
$scope.toggleSelection = function(item) { 
    var idx = $scope.selected.indexOf(item); 
    if (idx > -1) { 
    $scope.selected.splice(idx, 1); 
    } else { 
    $scope.selected.push(item); 
    } 
} 

表現を生成

はTypeError：ください、

デモコントローラとして、http://plnkr.co/edit/5auLDGbpyDFUcpPxBzNs?p=preview

デモ$スコープhttp://plnkr.co/edit/2jz0ieeCWJE6tvzXK69A?p=preview

：vm.selected.indexOfはGridController.vm.exist（37 gridController.js）で機能 ではありませんController As構文がこのコンテキストで適用されたときに何が問題になる可能性がありますか？

Answer 1

あなたtoggleSelection関数はそのng-model除き、ng-modelと同様の仕事をしているが、あなたの$scopeコード内各userについてselected性質を持っていますが、コントローラで特異vm.selectedプロパティバージョンとしては、JavaScriptプロトタイプ継承がプリミティブでどのように機能するかが原因です。これは、バインディングに.を使用しないと、予期せぬ結果が生じる主要な例です。

この場合ng-modelは今.indexOf性質を持っていませんブールを見ているあなたのexist機能にエラーにカスケード接続されたboolean型へのアレイからvm.selectedを変えています。

この場合、toggleSelectionコードは残りのコードロジックに対して必要な処理を行っており、実際にはng-modelは必要ありません。

Answer 2

vm.selectedをチェックボックスにバインドしました。これは、angleにブール値を設定するように指示します。 .indexOfを呼び出すと、ng-modelのチェックボックスはデフォルトでtrueまたはfalseのいずれかになります。

こちらをご覧ください：https://docs.angularjs.org/api/ng/input/input%5Bcheckbox%5D