Dismiss
Announcing Stack Overflow Documentation

We started with Q&A. Technical documentation is next, and we need your help.

Whether you're a beginner or an experienced developer, you can contribute.

Sign up and start helping → Learn more about Documentation →

i am getting the following error while trying to display the validation message using Angular.js.

Error:

angularjs.js:107 Error: [$parse:syntax] http://errors.angularjs.org/1.4.6/$parse/syntax?p0=%7B&p1=is%20an%20unexpected%20token&p2=17&p3=billdata.upload_%7B%7BNaNndex%7D%7D.%24touched&p4=%7B%7B%index%7D%7D.%24touched

I am explaining my code below.

<div class="input-group bmargindiv1 col-md-12" ng-repeat="mul in mulImage">
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">Image{{$index+1}}:</span>
 <div>
<div ng-class="{'myError': billdata.upload_{{$index}}.$touched && billdata.upload_{{$index}}.$invalid }">
<input type="file" class="filestyle form-control" data-size="lg" name="upload_{{$index}}" id="bannerimage_{{$index}}"  ng-model="mul.image" ngf-pattern="'image/*'" accept="image/*" ngf-max-size="2MB" ngf-min-height="400" ngf-resize="{width: 400, height:400}"  ngf-select="onFileSelect1('upload_{{$index}}',mul.image);">
 <div style="clear:both;"></div>
</div>
 </div>
<span class="input-group-btn" ng-show="mulImage.length>0">
<img ngf-thumbnail="mul.image" name="pro" border="0" style="width:32px; height:32px; border:#808080 1px solid;">
 <input type="button" class="btn btn-success" name="plus" id="plus" value="+" ng-click="addNewImageRow(mulImage);" ng-show="$last"> <input type="button" class="btn btn-danger" name="minus" id="minus" value="-"  ng-show="mulImage.length>1" ng-click="deleteNewImageRow(mulImage,$index);">

</span>
 <div class="help-block" ng-messages="billdata.upload_{{$index}}.$error" ng-if="billdata.upload_{{$index}}.$touched">
 <p ng-message="maxSize" style="color:#F00;">File is too large.Max size is 2 mb.</p>
 <p ng-message="minHeight" style="color:#F00;">Minimum height should be 400px</p>
 </div>
</div>

Here when i am adding this validation message <div class="help-block" ng-messages="billdata.upload_{{$index}}.$error" ng-if="billdata.upload_{{$index}}.$touched"> its throwing the above error.Please help me to resolve this error.

share|improve this question
    
statements in ng-if are treated as javascript, so {{$index}} is not replaced by the index. – ayushgp Apr 15 at 13:22
    
So,what should be the solution. – satya Apr 15 at 13:24
    
You can change the ng-if="billdata.upload_{{$index}}.$touched" to ng-if="billdata['upload_'+this.$index].$touched". and same changes to ng-messages. – ayushgp Apr 15 at 13:31
    
thanks i resolved that. – satya Apr 15 at 13:32
    
Please post how you did resolve that. If you solved with the help of a comment, state it and give credit to the author. If you solved in different way, write it down. – MarcoS Apr 15 at 13:35

Instead of "billdata.upload_{{$index}}.$error, I would use "billdata['upload_' + $index].$error

share|improve this answer

You can change the ng-if="billdata.upload_{{$index}}.$touched" to ng-if="billdata['upload_'+this.$index].$touched". and same changes to ng-messages

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.