如何将动态id设置为Angular 2?

我试过了:

<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"  }
];

但它不起作用.

推荐答案

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

<div class = "CirclePoint" *ngFor="let c of circles" 
    attr.id="Location{{c.id}}">
</div>

For the id attribute this might work as well (not tried myself yet)

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

Angular相关问答推荐

将Angular 17中的http服务与独立组件一起使用

导致无限请求的Angular HttpInterceptor和HttpClientModule

try 测试具有Angular material 下拉列表的组件时,在Angular 17中发现&q;错误的意外合成属性@TransitionMessages

未触发HTTP拦截器

路由在全局导航中总是给我/甚至使用相对路径

如何将表单作为Angular 分量输入传递?

NX如何在前端和后端使用一个接口库

等待两个订阅完成而不嵌套

Summernote 文本区域的输入字段文本验证失败

如何以Angular 改变环境

Subject.complete() 是否取消订阅所有听众?

Angular 5 Mat-grid 列表响应式

由于时区,Angular 4 日期管道显示错误的日期 - 如何解决这个问题?

如何在 Angular CLI 1.1.1 版中将路由模块添加到现有模块?

Angular 2如何让子组件等待异步数据准备好

移除 Angular 组件创建的宿主 HTML 元素 Select 器

Angular 4 设置下拉菜单中的选定选项

Angular 2 setinterval() 继续在其他组件上运行

Angular 4 错误:没有 HttpClient 的provider提供者

如何在 angular2 中的 div 的 contenteditable 上使用 [(ngModel)]?