CODEWITHSUNDEEP
javascripthtmlcssangularattributes
rokie12234
rokie12234

Reputation: 63

How to append index from *ngFor to attr.id - HTML

how can I append index to my attr.id so I would like to get unique id's for each row:

<tr *ngFor="let content of contents;let i=index;">
    <td style="width: 10%;">
      <input class="styled-checkbox" [attr.id]={{i}} + "content_item"  type="checkbox"  style="display:none;" value="" name="content-view">
      <label [attr.for]="content.id"></label>
    </td>
    <td>{{i+1}}</td>
</tr>

As you can see guys I'm trying to append :

[attr.id]={{i}} + "content_item"

so my id would look like 1content_item, 2content_item, 3content_item and so on..

But this doesn't work it says:

missing attribute name ..

And when I try this:

[attr.id]="{{i}}content_item"

it says:

Error: Template parse errors:

Upvotes: 0

Views: 290

Answers (1)

Sivaramakrishnan
Sivaramakrishnan

Reputation: 739

When you are binding a value to the attribute, you either use interpolation {{}} or property binding.Since you are using property binding you should not use interpolation

[attr.id]="i+ 'content_item'"

Upvotes: 3

Related Questions