Hunter
Hunter

Reputation: 1601

Angular js - ng-model in ng-repeat

Different 'ng-model name' in ng repeat - Possible?

<div  ng-repeat="todo in todos">
   <input type="text" ng-model="tag">  
   <button type="submit"ng-click="addTodo(todo._id)">Add</button>
</div>

In this case, there are some repeat todo item (based on todos json data) will show on frontend

My Problem: What i type on any input field , all input field showing same data

I need different ng-model name on each input field , I guess like this ng-model="tag($index)"

Upvotes: 0

Views: 424

Answers (3)

Kishore Indraganti
Kishore Indraganti

Reputation: 1322

It is possible like below

<div  ng-repeat="todo in todos">
   <input type="text" ng-model="tag[todo]">  <--todo.key-->
   <button type="submit"ng-click="addTodo(todo._id)">Add</button>
</div>

Upvotes: 2

Pankaj Parkar
Pankaj Parkar

Reputation: 136144

You could place the newly created model inside tag array by its $index, while declaring model inside the tag you should use array notation [] instead of ()

ng-model="tag($index)" 

should be

ng-model="tag[$index]"

Markup

<div  ng-repeat="todo in todos">
   <input type="text" ng-model="tag[$index]">  
   <button type="submit"ng-click="addTodo(todo._id)">Add</button>
</div>

Upvotes: 2

Diana R
Diana R

Reputation: 1174

You can do it like this:

 <input type="text" ng-model="todo.tag">  

Upvotes: 1

Related Questions