So I have this code below
<form name="registrationForm">
<div class="form-inline" ng-repeat="participant in participantsArray">
<div class="form-group">
<input ng-model="datas.name[$index+1]" name="name{{$index+1}}" required verify-name>
<span ng-if="registrationForm.name+($index+1).$dirty && registrationForm.name+($index+1).$invalid">error</span>
</div>
</div>
</form>
and is not working, how do I need to use the $index expression in the ng-if? the ng-model, and the name are working properly ...
So I have this code below
<form name="registrationForm">
<div class="form-inline" ng-repeat="participant in participantsArray">
<div class="form-group">
<input ng-model="datas.name[$index+1]" name="name{{$index+1}}" required verify-name>
<span ng-if="registrationForm.name+($index+1).$dirty && registrationForm.name+($index+1).$invalid">error</span>
</div>
</div>
</form>
and is not working, how do I need to use the $index expression in the ng-if? the ng-model, and the name are working properly ...
Share Improve this question edited Aug 10, 2017 at 10:00 FAISAL 34.7k10 gold badges101 silver badges106 bronze badges asked Aug 10, 2017 at 8:48 Darius BuhaiDarius Buhai 612 silver badges12 bronze badges 6- What you need to do in this code and what is the output of it ? – ZAhmed Commented Aug 10, 2017 at 8:50
- What is the angularjs version you have ? – Anil Yadav Commented Aug 10, 2017 at 8:53
- Why can't you save the value in scope and pass it here? – Hema Nandagopal Commented Aug 10, 2017 at 8:53
- It should work. I reckon you are using a older version of AngularJS 1.x – Devesh Sati Commented Aug 10, 2017 at 8:54
- I want to add participants for an event, and the output is correct, but I don t know how to add the $index in ng-if expression – Darius Buhai Commented Aug 10, 2017 at 8:55
3 Answers
Reset to default 5For dynamic fields you can use []
to wrap the dynamic string field.
registrationForm['name'+($index+1)].$dirty
refer the below example:
angular.module("app", [])
.controller("myCtrl", function($scope) {
$scope.items = ['a','b','c','d'];
});
<script src="https://ajax.googleapis./ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<div ng-app="app" ng-controller="myCtrl">
<form name="registrationForm">
<div ng-repeat="item in items">
<input ng-model="datas.name[$index+1]" name="name{{$index+1}}" required verify-name>
<span ng-if="registrationForm['name'+($index+1)].$dirty && registrationForm['name'+($index+1)].$invalid">error</span>
</div>
</form>
</div>
I ran into a same problem once. What you can do is instead of dot(.)
notation use bracket notation to access the form controls. Thats what worked for me. Below is a example. Try this this will work. Let know if you need help.
registrationForm['name'+($index+1)].$dirty
Hope it Helps :)
Try this :)
<span ng-if="registrationForm['name'+($index+1)].$dirty && registrationForm.name+($index+1).$invalid">error</span>