使用 ng-repeat 时避免 table 列中的重复索引

Question

下面是我的 plunker，我试图在其中显示基于不同 months.I 的输出类型希望通过获取 [= 中的所有值来保存每个月单击保存按钮时的最大容量=25=] 当我在文本框中键入时，随着索引按列重复，值会重复。

代码如下：

JavaScript:

app.controller('MainCtrl', function($scope) {
    $scope.name = 'World';

    $scope.outputType=["Coal","ROM","WASTE"];
    $scope.months=["JAN","FEB","MARCH","APRIL"];
    $scope.values = [];
    $scope.save=function(){
        alert($scope.values)
    }
});

HTML:

  <table style="border:1px solid red;">
    <thead>
        <tr>
            <th>&nbsp;</th>
            <th ng-repeat="i in months"><b>{{i}}</b></th>
        </tr>
    </thead>
    <tbody ng-repeat="item in outputType">
        <tr>
            <td>{{item}} </td>
            <td ng-repeat="i in months">
                <input type="text" ng-model="values[$index]"
                       placeholder="Max.Capacity">

            </td>
        </tr>
    </tbody>
</table>

Answer 1

检查http://plnkr.co/edit/4DUDIBoTOCI4J89FiQeM?p=preview

JS

$scope.values = {};

HTML

<input type="text" ng-model="values[item][i]"  placeholder="Max.Capacity">

或

<input type="text" ng-model="values[i][item]"  placeholder="Max.Capacity">

Answer 2

如果想留下一个数组的解决方法。

您需要更改输入ngModel

<input type="text" ng-model="values[$index]" placeholder="Max.Capacity">

至

ng-model="values[$parent.$index][$index]".

这是一个例子：

Example

使用 ng-repeat 时避免 table 列中的重复索引

Avoiding duplicate index in columns in table when using ng-repeat

javascript

angularjs

ng-repeat