javascript - 将所有值保存在 ng-repeat 中的输入文本框中

Question

我想知道如何通过单击按钮保存在 ng-repeat 内的输入文本框中输入的值。我见过这样的例子 getting values from text box允许用户单独保存每个文本框。下面是一个示例代码:

$scope.items=[1,2,3,4]

<div ng-repeat="item in items">
<input type="text" ng-model=item.id>
</div>
<button type="button" ng-click="saveAllValues()">Save</button>

Answer 1

您只需将 ng-model 绑定(bind)到另一个对象并使用 $index 来引用 ng-repeat 中的索引:

var myApp = angular.module('myApp', []);

myApp.controller('MyCtrl', function($scope) {
  $scope.items = [1, 2, 3, 4];
  $scope.values = [];
  
  $scope.saveAllValues = function() {
    alert($scope.values);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="myApp" ng-controller="MyCtrl">
  <div ng-repeat="item in items">
    <input type="text" ng-model="values[$index]">
  </div>
  <button type="button" ng-click="saveAllValues()">Save</button>
</div>