2

オブジェクトのリストをループするテーブルの一部であるフォームを作成しようとしています。オブジェクトごとに、ユーザーは属性をチェック/チェック解除できます。フォームの残りの部分は問題なく動作しますが、チェックボックスに ng-model 属性を設定するのに問題があります。

ここに私が持っているものがあります:

<table>
    <thead>
        <tr>
            <td>Objects and Fields</td>
            <td>Createable</td>
            <td>Deleteable</td>
            <td>Readable</td>
            <td>Updateable</td>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="object in myAppObjects">
          <td>
            {{object.name}}&nbsp;{{object.id}}
            <input type="checkbox" name="app_access_{{object.id}}" ng-model="app_access" value="false">
          </td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
        </tr>
      </tbody>
</table>

最初に、各セルに一意の ng-model を持つように ng-model="app_access_{{object.id}}" を設定しようとしました。これにより、テーブルの行が数十回繰り返されました。これらの空のセルには、それぞれチェック ボックスもあります。オブジェクトごとに 5 つのチェック ボックスがあり、特定の時点でフォーム内の複数のオブジェクトがあります。コントローラーの各チェック ボックス (または、チェックされているもののリスト) にアクセスできる必要があります。

4

2 に答える 2

3

ngRepeat はアイテムごとに新しい (子) スコープを作成するため、アイテムの新しい ng-models (それらの新しいスコープに関連付けられている) の作成は機能しません。これらのモデル/データはそれらの内部スコープ内でのみアクセス可能になるためです。これらの内部/子スコープにアクセスするコントローラー関数を作成することはできません。モデルの myAppObjects で何かを参照することをお勧めします (@Max が 2 番目の例で提案しているように)。

myAppObjects が次のようになっている場合:

$scope.myAppObjects = [
  {id: 1, cb1: true,  cb2: false, cb3: true, cb4: true,  cb5: false },
  {id: 2, cb1: false, cb2: false, cb3: true, cb4: false, cb5: true  },

次のように ng-repeat を記述できます。

<tr ng-repeat="appObj in myAppObjects">
    <td>{{appObj.id}}
        <input type="checkbox" ng-model="appObj.cb1"></td>
    <td><input type="checkbox" ng-model="appObj.cb2"></td>
    <td><input type="checkbox" ng-model="appObj.cb3"></td>
    <td><input type="checkbox" ng-model="appObj.cb4"></td>
    <td><input type="checkbox" ng-model="appObj.cb5"></td>
</tr>

作業フィドル: http://jsfiddle.net/mrajcok/AvGKj/

結論: ngRepeat の内部/子スコープではなく、親スコープ (私のフィドル、MyCtrl の $scope) 内/上でチェックボックス モデルを定義する必要があります。

于 2012-12-01T00:04:19.663 に答える
0

一般に、を使用してコレクションを反復処理する場合、ng-repeat表示および編集するアイテムはコレクションの個々のメンバーです。したがって、編集中の文字列の配列がある場合はng-repeat、

<div ng-repeat="item in list">
  <input ng-model="item" />
</div>

または、反復しているオブジェクトのリストである場合は、

<div ng-repeat="obj in list">
  <input ng-model="obj.item" />
</div>
于 2012-11-30T06:05:57.167 に答える