angular – 无法将变量设置为html元素属性

发布时间：2020-12-17 07:56:07 所属栏目：安全来源：网络整理

导读：参见英文答案 Angular 2 data attributes2个我发现了一个我不知道如何解决的问题. 如果您使用此模板,那么没有问题： li *ngFor="#supplier of supplierList | async" a (click)="changeSupplier($event)" span{{supplier.id}}: {{supplier.name}}/span /a/l

参见英文答案 > Angular 2 data attributes2个
我发现了一个我不知道如何解决的问题.

如果您使用此模板,那么没有问题：

<li *ngFor="#supplier of supplierList | async">
    <a (click)="changeSupplier($event)">
        <span>{{supplier.id}}: {{supplier.name}}</span>
    </a>
</li>

输出是例如：

<li>
    <a>
        <span>1: Sony</span>
    </a>
</li>
<li>
    <a>
        <span>2: Samsung</span>
    </a>
</li>

如果我编辑模板并尝试将“supplier.id”设置为html属性“data-supplierid”：

<li *ngFor="#supplier of supplierList | async">
    <a (click)="changeSupplier($event)" data-supplierid="{{supplier.id}}">
        <span>{{supplier.name}}</span>
    </a>
</li>

出现错误：

Can't bind to 'supplierid' since it isn't a known native property ("i>
                    <li *ngFor="#supplier of supplierList | async">
                        <a (click)="changeSupplier($event)" [ERROR ->]data-supplierid="{{supplier.id}}">
                            <span>{{supplier.name}}</span>
                        </a>

默认是属性绑定.对于属性绑定使用

attr.data-supplierid="{{supplier.id}}"

要么

[attr.data-supplierid]="supplier.id"

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!