Question

我有一个应用程序，可在用户单击按钮时动态创建输入元素。它看起来像这样：

[输入] [+]

该输入有一个ng-model，我可以在附加新输入时使用$compile让Angular将它们视为在引导时在DOM中的对象。

我可以将ng-model值增加为“item1”，“item2”等，但我不喜欢这样。

我想知道是否有一个数组可以保存所有输入的所有值。

感谢。

Answer 1

你可以试试这个：

HTML

<div ng-controller="myCtrl">
  <button ng-click="addInputField()">add</button>
  <ul>
    <li ng-repeat="item in items">
        <input type="text" id="item{{input.id}}" ng-model="item[$index]"/>
    </li>
  </ul>
  data:
  <div ng-repeat="item in items">
    {{item}}
  </div>
</div>

CONTROLLER

angular.module('app',[])
.controller('myCtrl',function($scope){
  $scope.items = [];
  $scope.addInputField = function(){
    $scope.items.push({});
}
});

以下是JSFiddle demo

'Items'是绑定到输入字段列表的数据。您可以通过更新范围内的items数组来维护视图，并将数组的元素绑定到每个输入字段视图。

希望这有用。

如何使用ngModel属性处理动态添加的输入

1 个答案: