javascript 将所有值保存在 ng-repeat 中的输入文本框中
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32781366/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Save all the values in input text box that is in ng-repeat
提问by forgottofly
I'm figuring out how can I save the values that are entered in the input text box inside ng-repeaton a single click of a button.I have seen examples like this getting values from text boxthat lets user to save each text box individually.
Below is a sample code:
我正在弄清楚如何通过ng-repeat单击一个按钮来保存在输入文本框中输入的值。我见过这样的例子，从文本框中获取值，让用户可以单独保存每个文本框。下面是一个示例代码：
$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>
回答by DonJuwe
You just bind the ng-modelto another object and use $indexto refer to the index within the very ng-repeat:
您只需将 绑定ng-model到另一个对象并使用$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>回答by RAMESHKUMAR
var myApp = angular.module('myApp', []);
myApp.controller('MyCtrl', function($scope) {
$scope.items = [1, 2, 3, 4];
$scope.saveAllValues = function() {
alert($scope.items);
}
});<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="$index in items">
<input type="text" ng-model='items[$index]'>
</div>
<button type="button" ng-click="saveAllValues(items)">Save</button>
</div>回答by Rayon
Try this:
试试这个：
You need to have
.notation in your model. Refer this
您
.的模型中需要有符号。参考这个
angular.module('myApp', [])
.controller('myController', function($scope) {
$scope.items = [{
value: 0
}, {
value: 1
}, {
value: 2
}]
$scope.saveAllValues = function(items) {
alert(JSON.stringify(items));
};
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/angular.min.js"></script>
</head>
<body ng-controller="myController">
<div ng-repeat="item in items">
<input type="text" ng-model='item.value'>
</div>
<button type="button" ng-click="saveAllValues(items)">Save</button>
</body>
</html>回答by pam05
I was stuck in the same and found something good "ng-model-option" set is to update on blur and you are ready to save individual inputs value while doing "ng-repeat". You'll need to add newer version of angularjs, try this "https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.js"
我陷入了同样的困境，发现一些好的“ng-model-option”设置是更新模糊，你准备在执行“ng-repeat”时保存单个输入值。您需要添加较新版本的 angularjs，试试这个“ https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.js”
var myApp = angular.module('myApp', []);
myApp.controller('MyCtrl', function($scope) {
$scope.items = ['red', 'blue', 'green', 'yellow'];
$scope.saveAllValues = function() {
alert($scope.items );
}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
<div ng-repeat="item in items">
<input type="text" ng-model="items[$index]" ng-model-options="{updateOn:'blur'}">
</div>
<button type="button" ng-click="saveAllValues()">Save</button>
</div>