Name: {{data.name}} <...">
Geek Answers Handbook

AngularJS: variables in ng model

I have a ng-repeat loop

<div ng-repeat="data in datas"> Name: {{data.name}} <input type="text" ng-model="age"> </div>

I want $scope.age become $scope.age_data.name . For example: $ scope.age_Tan, $ scope.age_Jim ... So I tried ng-model="age_{{data.name}}" , but he made a mistake. How to solve this?

+5
source share
3 answers

The “right” way to do this is in the controller to do this:

 $scope.ages = {};

Then in the template:

 Name: {{data.name}} <input type="text" ng-model="ages[data.name]">

Must work...

+14
source

What you show here will not work here a few parameters

 angular.module('myApp', []) .controller('MyCtrl', function() { var vm = this; vm.datas = [{ name: 'thing1' }, { name: 'thing2' }, { name: 'thing3' }]; }) 
 <html ng-app="myApp"> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> </head> <body ng-controller="MyCtrl as myCtrl"> Option 1 <div ng-repeat="data in myCtrl.datas"> <input type="text" ng-model="data.age" /> </div> <br/> <br/>Option 2 <div ng-repeat="data in myCtrl.datas"> <input type="text" ng-model="myCtrl.age[data.name]" /> </div> <pre>{{myCtrl|json}}</pre> </body> </html>
+1
source

I'm not sure why you want to keep a person's age in another object / container. Here is a solution that can help you rethink design.

 $scope.people= [ {name: 'Tan', age: 20}, {name: 'Jim', age: 21} ]; <div ng-repeat="person in people"> Name: {{person.name}} <input type="text" ng-model="person.age"> </div>
0
source

More articles:


All Articles