angular - Angular Clarity Icon 无法绑定到 ngFor 循环中的 CSS 形状属性

Question

我正在尝试建立一个链接列表，其中链接是从休息调用中提供的。生成的链接列表将包含一个 URL 和一个类型标识符。我正在尝试使用 ngFor 循环显示图标，并且正在使用库存的 Clarity 图标集：

<ng-template ngFor let-link [ngForOf]="links" let-j="index" >
    <clr-icon shape={{link.icon}} height="42" width="42"></clr-icon>
    ...

但是，当我运行它时，我得到：

ERROR Error: Uncaught (in promise): Error: Template parse errors:
Can't bind to 'shape' since it isn't a known property of 'clr-icon'.
1. If 'clr-icon' is an Angular component and it has 'shape' input, then verify that it is part of this module.
2. If 'clr-icon' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

在这种情况下，有没有办法将形状绑定到图标，或者 CSS 属性是不行的？

标签： angularvmware-clarity

Answer 1

你必须使用属性绑定来做到这一点。

<clr-icon [attr.shape]="link.icon" height="42" width="42"></clr-icon>