angularjs - angular validation within ng-repeat -
i have below validation texboxes within ng-repeat
<div class="col-md-6 col-lg-2"> <div class="form-group"> <label for="country{{$index}}" class="control-label required">country</label> <div class="input-group"> <mc-lookup-dropdown data-lookup-name="countrytype" required data-model="contactaddress.country" id="country{{$index}}" name="country{{$index}}" class="form-control"></mc-lookup-dropdown> </div> <div data-ng-messages="memberdemographics.demographics.$error" class="validation-errors"> <div data-ng-message="country">{{ contactaddress.$servererrors.country }}</div></div> <div data-ng-messages="demographicsform.{{'country'+$index}}.$error" class="validation-errors"> <div data-ng-message="required" data-ng-show="!demographicsform.{{'country'+$index}}.$pristine">this field required</div> </div> </div> </div>
below error thrown on pageload "rror: [$parse:syntax]
http://errors.angularjs.org/1.5.8/$parse/syntax?p0=%7b&p1=is%20not%20a%20validnandentifier&p2=18&p3=demographicsform.%7b%7b'phonenumber'%2b%index%7d%7d.%24error&p4=%7b%7b'phonenumber'%2b%index%7d%7d.%24error"
i need have expression in ng-message since textname depends on $index of ng-repeat loop..
these lines having errors:
<div data-ng-messages="demographicsform.{{'country'+$index}}.$error" class="validation-errors"> <div data-ng-message="required" data-ng-show="!demographicsform.{{'country'+$index}}.$pristine">this field required</div>
change :
<div data-ng-messages="demographicsform['country' + $index].$error" class="validation-errors"> <div data-ng-message="required" data-ng-show="!demographicsform['country'+$index].$pristine">this field required</div>
from this article
you need wrap in braces when using angular's templating system - braces tell angular replace value. in case, value of data-ng-message expression being evaluated.
Comments
Post a Comment