html - 尝试在样式中插入 typescript 元素时出现术语预期错误

Question

在我的 ts 文件中，我有在 html 文件中使用的元素。在此示例中，我使用 element.color (值 = #3b5998)和 element.name (值 = Facebook)。当将像下面这样的值放在图标下面时，一个可以工作，但颜色不行。代码如下所示:

<fa style="color: {{element.color}};" name="{{element.icon}} fa-3x"></fa>

颜色后面:有一条红线，表示“预期的术语”。但我不知道该改变什么。我知道这是一个转储错误，但我被卡住了。

Image

Answer 1

要绑定(bind)到样式，有两种方法:

使用style binding

<fa [style.color]="element.color" [name]="element.icon + ' fa-3x'"></fa>

或使用NgStyle指令

<fa [ngStyle]="{ color: element.color }" [name]="element.icon + 'fa-3x'"></fa>