Динамически добавлять входные данные для более чем одного массива - PullRequest
0 голосов
/ 27 сентября 2018

Я пытаюсь добавить более одного входа массива и кнопку для создания новых входов.

У меня есть четыре массива vm.work_place[], vmwork_year_start[], vm.work_yead_end[], vm.work_why_left[].Я хочу создавать новый вход каждый раз, когда я нажимаю кнопку и другую кнопку, которая удаляет этот ввод.

<button ng-click="vm.work_place.push(' ');vm.work_year_start.push(' ');vm.work_yead_end.push(' ');vm.work_why_left.push(' ');">Add row</button>

<tr ng-repeat="x in vm.work_place">
    <td>
        <input name="work_place[]" ng-model="vm.work_place[$index]"/>
    </td>
    <td>
        <input name="work_place[]" ng-model="vm.work_year_start[$index]"/>
    </td>
    <td>
        <input name="work_place[]" ng-model="vm.work_yead_end[$index]"/>
    </td>
    <td>
        <input name="work_place[]" ng-model="vm.work_why_left[$index]"/>
    </td>
    <td>
        <button ng-click="vm.work_place.splice(index, 1);vm.work_year_start.splice(index, 1);vm.work_yead_end.splice(index, 1);vm.work_why_left.splice(index, 1);">Remove row</button>
    </td>
</tr>

Но проблема в том, что приведенный выше код выдает мне ошибку ngRepeat:dupes, когда янажмите на кнопку добавления новой строки.

Как я могу создать более одного входа одновременно, т.е.добавить элемент на все четыре массива?

1 Ответ

0 голосов
/ 27 сентября 2018

ngRepeat:dupes эта ошибка возникает, когда вы выполняете итерацию в массиве с повторяющимися значениями. Так что, я думаю, вы получите ошибку при добавлении строки во второй раз.потому что уже vm_worksapace имеет ' ' в качестве данных при добавлении первой строки и при повторном нажатии ' ' добавляется снова, так что теперь есть повторяющееся значение, и ng-repeat выдаст вам ошибку.Чтобы сделать эту работу с повторяющимся значением

, замените <tr ng-repeat="x in vm.work_place" > на <tr ng-repeat="x in vm.work_place track by $index" >

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...