ng-class evaluation with ng-repeat in angular

Question

I am trying to add red frame to a field in a form in angular.
When working with static fields (not populated with ng-repeat) everything is working good. When the field is created with ng-repeat looks like the ng-class that uses the current index is not working. The form state is correct but the class with the red frame is not added to the field.

See this Plunker: http://plnkr.co/edit/hDfTHY?p=preview When adding a value to all input fields the button become enabled. However, only first input is red when empty.

Thanks

score 2 · Accepted Answer · edited May 23 '17 at 11:57

2

One option is to add inner form:

<div ng-form="nested" class="col-md-4" ng-class="{'has-error': nested.item.$invalid}">
     <input type="text"
            ng-model="item"
            class="form-control"
            name="item"
            id="item{{$index}}"
            required ng-minlength="2">
</div>

See this question

edited May 23 '17 at 11:57

Community

1
1

answered Mar 23 '14 at 09:42

karaxuna

26,752
13
82
117

Hi, it doesn't seem to work on the Plunker i created. Can you make it work on the Plunker please – Roi Ezra Mar 23 '14 at 09:44

ng-class evaluation with ng-repeat in angular

1 Answers1