javascript 双向绑定不适用于 ng-repeat
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29261507/
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
two way binding not working with ng-repeat
提问by jsbisht
I have a simple ng-repeat list, in which i am assigning current list item value to another property on the controller as follows:
我有一个简单的 ng-repeat 列表，其中我将当前列表项的值分配给控制器上的另一个属性，如下所示：
<li ng-repeat="num in list">
<input type="text" ng-init="value = num" ng-model="value" />
<button type="button" class="btn btn-primary" ng-click="save()">Save</button>
</li>
But when i click the Save button i get default value set for $scope.value. I expect the value for the particular input text to be displayed.
但是当我单击“保存”按钮时，我为 $scope.value 设置了默认值。我希望显示特定输入文本的值。
Here is the controller:
这是控制器：
angular.module('myApp', [])
.controller('MyController', function($scope){
$scope.value = false;
$scope.list = [0, 1, 2, 3, 4];
$scope.save = function() {
alert($scope.value);
}
});
How can i access the updated value of a input item in my controller on save function call.
如何在保存函数调用时访问控制器中输入项的更新值。
Here is the plunker for the same: plnkr
这是相同的plunker：plnkr
Update: I am expecting the value to be fetched to controller without passing it as a parameter.
更新：我希望将值提取到控制器而不将其作为参数传递。
回答by AvetisG
Wow I can't believe most people have missed this. If you are using Angular 1.2 then you should definitely check out track bykeyword in your ngRepeat directive.
哇，我不敢相信大多数人都错过了这个。如果您使用的是 Angular 1.2，那么您一定要检查track byngRepeat 指令中的关键字。
<li ng-repeat="num in list track by $index">
<input type="text" ng-model="list[$index]" />
<button type="button" class="btn btn-primary" ng-click="save()">Save</button>
</li>
Bottom line is stay away from primitive types when bindingsince it will give you sync issues.
底线是在绑定时远离原始类型，因为它会给您带来同步问题。
Fellas please put more time and effort into researching your solutions instead of just posting for points.
伙计们，请花更多的时间和精力来研究您的解决方案，而不仅仅是张贴积分。
Hope this helps!
希望这可以帮助！
回答by Elad
ngRepeat create a scope, so, object is passed by reference and number by value. Your code is problematic, if you successfully update the value, it will update all the numbers in ng-repeat. You can do this:
ngRepeat 创建一个范围，因此，对象通过引用和数字通过值传递。您的代码有问题，如果您成功更新该值，它将更新 ng-repeat 中的所有数字。你可以这样做：
html
html
{{value.val}} <!-- for check the value -->
<li ng-repeat="num in list">
<input type="text" ng-model="num" />
<button type="button" class="btn btn-primary" ng-click="value.val=num">Save</button>
</li>
javascript
javascript
angular.module('myApp', [])
.controller('MyController', function($scope){
$scope.value = {val:false};
$scope.list = [0,1,2,3,4];
});
I'm sorry about my english...
我很抱歉我的英语...
回答by Harpreet Singh
here it is how you can do that
这是你如何做到的
<li ng-repeat="num in list">
<input type="text" ng-init="value = num" ng-model="value" />
<button type="button" class="btn btn-primary" ng-click="save(value)">Save</button>
</li>
angular.module('myApp', [])
.controller('MyController', function($scope){
$scope.value = false;
$scope.list = [0, 1, 2, 3, 4];
$scope.save = function(argument) {
$scope.value = argument;
alert($scope.value);
}
});
回答by Brian
Lets not abuse the expression "2 way binding";)
让我们不要滥用表达“2 路绑定”;)
Your controller has one scope and there is just one $scope.valuein that scope. You cannot force is to have multiple values simultaneously.
您的控制器有一个作用域，并且$scope.value在该作用域中只有一个作用域。您不能强制同时具有多个值。
ng-repeatcreates new scope for each li. And even if you try to use $parent.value, your controller's $scope.valuewill only have the last assigned value in ng-init
ng-repeat为每个li. 即使您尝试使用$parent.value，您的控制器$scope.value也将只有最后一个分配的值ng-init
You best bet in this case to pass the value as an argument. Hope this helped to explain the issue a little more. Correct me if I am wrong.
在这种情况下，您最好将值作为参数传递。希望这有助于更多地解释这个问题。如果我错了，请纠正我。
