Angular 如何在*ngFor中设置动态id？

如何在Angular 2中设置动态

id

我试过：

<div class = "CirclePoint" *ngFor="#c of circles" id = "{{ 'Location' + c.id }}"></div>

this.circles = [
        { x: 50 , y: 50 ,id : "oyut1" },
        { x: 100 , y: 100 ,id : "oyut3"  },
        { x: 150 , y: 150 ,id : "oyut2"  }
];

这个圆=[
{x:50，y:50，id:“oyut1”}，
{x:100，y:100，id:“oyut3”}，
{x:150，y:150，id:“oyut2”}
];

但它不起作用。

试试这个：

 <div class = "CirclePoint" *ngFor="let c of circles">
     <div id="location_{{c.id}}">write something which you want like c.x </div>
 </div>`

写一些你想要的东西，比如c.x
`

希望这对你有用。我搜索了StackOverflow，找到了这个

---

在组件标签内，而不是通常的

id=“#c”

使用

[id]=“#c”

。这也适用于动态类名。见下例：

<div class = "CirlePoit" *ngFor="#c of circles" [id] = "#c"> </div>

这同样适用于：

<div class = "CirclePoint" *ngFor="let c of circles">
   <div [id]="c.id"></div>
</div>

如果要添加前缀，请说“loc”

使用[]有助于动态添加值

索引可以用作动态ID

测试按钮
{{item}}

谢谢您的回答。但我正在处理angular2“ng attr id”不再有效。对不起，我在angular2中没有see标签就无法工作，我回答你。我从netThanks那里找到了一些反馈答案，我认为有一些特殊处理的常见属性，但可能是我弄错了什么。

<div class = "CirlePoit" *ngFor="#c of circles" [id] = "#c"> </div>

<div class = "CirclePoint" *ngFor="let c of circles">
   <div [id]="c.id"></div>
</div>

<div class = "CirclePoint" *ngFor="let c of circles">
   <div [id]="'loc' + c.id"></div>
</div>

<div class="test" *ngFor="let item of data; let i = index">
<div class="function_div" (click)="test(i);">Test Button </div>
    {{item}}
</div>