CODEWITHSUNDEEP
javascriptangularjsangularjs-ng-repeatdynamically-generatedangularjs-ng-model
pik4
pik4

Reputation: 1373

Dynamic ng-model into ng-repeat AngularJS

I'm trying to generate dynamically ng-model directive in ng-repeat but I receive an error from browser. We get dynamically attributes of a type and I would like to set its in DOM.

I'm recieving this error:

Error: [$parse:syntax] Syntax Error: Token '{' invalid key at column 2 of the expression [{{'attribute.'+attribute.label}}] starting at [{'attribute.'+attribute.label}}].

Click here

<div class="form-group" ng-repeat="attribute in objectType.objectAttributes | orderBy : attribute.order">
     <div class="col-sm-10" ng-if="attribute.multivalued==false">
          <input type="{{attribute.type}}" class="form-control"
              ng-model="{{'attribute.'+attribute.label}}">
     </div>
</div>

Do you have any idea which can help me to solve this problem? Thank you!

Upvotes: 2

Views: 510

Answers (3)

Sam
Sam

Reputation: 149

don't use {{}} in ng-model. Use [] for dynamic ng-model. In your case use like this

<div class="form-group" ng-repeat="attribute in objectType.objectAttributes | orderBy : attribute.order">
 <div class="col-sm-10" ng-if="attribute.multivalued==false">
      <input type="{{attribute.type}}" class="form-control"
          ng-model="value1[attribute.label]">
 </div>

where "value1" in ng-model is your input value. But remember use $scope.value = [] in your controller. I hope it helps you

Upvotes: 0

pik4
pik4

Reputation: 1373

This isn't correct form and an error occurs if I tried but finally I did this and then I get the whole list of attributes. If change the input then change attribute.value into each attribute. It 's very tricky but works! Thank you!

<div ng-repeat="attribute in indoor.values | orderBy : attributes[$index].order">
     <input type="{{attributes[$index].type}}" class="form-control"
          ng-model="attribute.value">
</div>

Upvotes: 1

Pritam Banerjee
Pritam Banerjee

Reputation: 18923

You can do it like this way :

ng-model="attribute.{{attribute.label}}"

Upvotes: 0

Related Questions