Issue
I have to Create a list of checkboxes dynamically so i have used *ngFor to iterate the array of objects everything is working fine till iteration. the problem is occured when i set the value of for
attribute in the label tag. angular has throw the error :
Can't bind to 'for' since it isn't a known native property angular2
new error message
Unhandled Promise rejection: Template parse errors: Can't bind to 'for' since it isn't a known property of 'label'.
<div *ngFor="#batch of batch_array">
<label for="{{batch.id}}">
<input type="checkbox"
[value]="batch.id"
id="{{batch.id}}"
(click)="batchSelectedEevent(batch.id)"/>
{{batch.batch_name}}
</label>
</div>
here is my plnkr showing error : http://plnkr.co/edit/aAQfWvHc7h7IBuYzpItO?p=preview
whats wrong here in my code ?
Solution
update
In Angular2 final [for]="xxx"
should work fine. They added an alias from for
to htmlFor
.
original
Angular by default uses property binding but label
doesn't have a property for
. To tell Angular explicitly to use attribute binding, use instead:
[attr.for]="someField"
or
attr.for="{{someField}}"
instead.
These also work because htmlFor
is the property for
is reflected to.
[htmlFor]="someField"
htmlFor="{{someField}}"
In Angular2 RC.6 an alias was added so these should now work as well:
[for]="someField"
or
for="{{someField}}"
Answered By - Günter Zöchbauer
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.