Question

は、私がイメージを持つシンプルなチェックボックスをシミュレートディレクティブを持って結合双方向：これはng-repeatの罰金外に動作します

movieApp.directive("imageCheckbox", 
function() 
{ 
    return { 
     restrict: "E", 
     scope: { ngModel: '=' }, 
     template: 
      '<div ng-switch on="ngModel"> \ 
       <div ng-switch-when="true"> \ 
        <img src="/Content/Images/CheckTrue.png" ng-click="onClick()"> \ 
       </div> \ 
       <div ng-switch-default> \ 
        <img src="/Content/Images/CheckFalse.png" ng-click="onClick()"> \ 
       </div> \ 
      </div>', 
     link: function(scope, element, attrs) 
     { 
      scope.onClick = function() 
      { 
       scope.ngModel = !scope.ngModel; 
      }; 
     } 
    }; 
}); 

。ただし、ng-repeatの内部では、ngModelに双方向バインドされません。

<tr class="movie-info-row" ng-repeat="movie in movies"> 
<div class="movie-checkbox"> 
    <image-checkbox ng-model="isSelectedToDownload" ng-click="onSelectToDownloadClick(movie.RefId)" /> 
</div> 

あり、テーブルの行の内部より多くのですが、それはここでは関係ありません：

ng-repeatは、テーブル内でこのようなものです。 onSelectToDownloadClickハンドラが動作し、私に正しいmovie.RefIdが返されますが、スコープ内のisSelectedToDownloadフラグは更新されません。 ng-repeatの外部にあるときに更新されます。

アイデア？

Answer 1

は、私は最終的にこれを考え出したし、多分それは同様に他の人に便利です：

ng-repeatディレクティブはprototypically親スコープから継承し、独自の子スコープを作成します。私は実際には親のngModel変数を隠し、結合双方向を無効にするので、これにより、子スコープの新しい変数を作成ngModelonClick機能でscope.ngModel = !scope.ngModel;を割り当てることにより

。

解決策？いくつかあります。 私は（vmにコントローラを設定）コントローラなどの構文に行ってきましたし、このように呼び出す：

<image-checkbox ng-model="vm.isSelectedToDownload" ng-click="onSelectToDownloadClick(movie.RefId)" /> 

私はprototypically継承された変数自体を変更することはできません。私はその性質を変えることができます。