Как избежать дублирования индекса в столбцах таблицы при использовании ng-repeat

0

Ниже мой плукер, в котором я пытаюсь отобразить типы вывода на основе разных месяцев. Я хочу сохранить максимальную емкость для каждого месяца при нажатии кнопки сохранения, получив все значения в массиве. Но когда я печатаю в текстовом поле значение повторяется, поскольку индекс повторяется в столбце.

ng-repeat в таблице

Ниже приведен код:

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>
  • 1
    Пожалуйста, отредактируйте соответствующий код как текст в вашем посте. Внешние ссылки не заменяют код в самом посте.
  • 0
    @ryanyuyu я не получил ваш комментарий
Показать ещё 3 комментария
Теги:
ng-repeat

2 ответа

2
Лучший ответ

Проверьте, что 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">
Поделиться
  • 0
    Итак, после сохранения данных мне нужно иметь JSON в таком же формате, как вы показали, чтобы я мог связать их обратно?
  • 0
    Можете ли вы объяснить, в чем причина проблемы и почему это решается?
Показать ещё 4 комментария
1

Решение, если вы хотите оставить массив.

Вам нужно изменить свой ngModel на вход

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

в

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

Вот пример:

пример

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню