4

次のマークアップがあります

<div ng-app>
    <table ng-controller="test">
        <tbody>
            <tr ng-repeat="row in rows">
                <td ng-repeat="col in cols">
                    <input type="text" ng-model="row[col].val" />
                </td>
            </tr>
        </tbody>
    </table>
</div>

コントローラーはこんな感じ

function test($scope) {
    $scope.cols = ["col1", "col2", "col3"];
    $scope.rows = [{
        col1: { val: "x"}
    }, {
        col2: { val: "y" }
    }]
}

まだ存在しない列の値を設定しようとすると、

「未定義のプロパティ 'val' を設定できません」.

例はこちらhttp://jsfiddle.net/z9NkG/2/

ドキュメントには注意があります:

ngModel は、現在のスコープで式を評価することによって、指定されたプロパティにバインドしようとします。プロパティがこのスコープにまだ存在しない場合は、暗黙的に作成され、スコープに追加されます。

ただし、プロパティ名の代わりにインデクサーを使用すると失敗します。

ngModel 式を動的に定義する方法はありますか、それとも角度を誤用していますか?

4

4 に答える 4

3

そして何について:

<input type="text" ng-model="row[col].val" ng-init="row[col] = row[col] || {}" />

フィドル: http://jsfiddle.net/z9NkG/8/

于 2013-10-03T06:41:55.623 に答える
1

モデルについてはわかりませんが、2 次元配列を使用していると思います。私は単純化しすぎて、わからないのですが、

cols コレクションを子または rowsL にする

function test($scope) {
    $scope.colnames = ["col1", "col2", "col3"];
    $scope.rows = [{
        cols: { col1: "x"},  { col2: "y"}
    }, {
        cols: { col1: "z"},  { col2: "a"}
    }]
}

そして、ネストされた ng-repeat を使用します

  <table>
    <tbody>
        <tr ng-repeat="row in rows">
            <td ng-repeat="col in row.cols">
                <input type="text" ng-model="col.val" />
            </td>
        </tr>
    </tbody>
  </table>
于 2013-10-03T06:17:34.630 に答える
0

これを試して

コントローラーで変更を行い、コードの下に追加します

 $scope.cols.forEach(function(x, y) {
        angular.forEach($scope.rows, function(i, j) {
            if ((i[x])== null)
                i[x] = {};

        });
    })

フィドルを参照できますhttp://jsfiddle.net/z9NkG/10/

于 2013-10-03T06:49:53.660 に答える