Angular 4: setting the local variable # dynamically

Question

Is there a way to dynamically set the #id, the HTML attribute that angular uses to construct the @ViewChild element reference?

Specific need: i have the following te

Answer 1

You can use like this code:

<ul>
    <li *ngFor="let item of items;let i = index;" #itemRef{{i}}>{{item.xyz}}</li>
</ul>

Look this question: enter link description here

Answer 2

You can use the index for it.

 <ul>
<li *ngFor="let link of links; let i=index;">
{{link.title}}{{i}} 
</li>
</ul>

Answer 3

Despite the seeming resemblance between regular variables and #, multiple elements can be assigned to single local template reference variable:

<ul>
   <li *ngFor="let link of links" #linkRef></li>
</ul>

Which can be obtained with:

@ViewChildren('linkRef') linkRefs;