Angular 回答问题时，如何使用[style.border]更改边框样式？

回答这个问题时，我很难将边框样式从$vivid blue更改为$medium gray。 这是我的代码：

<section id="question" [style.border]="!answer ? 'unanswered': 'answered'">

---

使用

ngClass

有条件地应用类名，如下所示：

或者，您可以通过将逻辑代码移动到组件来实现相同的功能：

public applyClass（）：字符串{
返回（此.答案）？“已回答”：“未回答”
}

在模板中完成此操作：

使用

或

或

如果您想使用样式而不是类，那么

在你的css中

。调用{
边框：2倍实心！重要；
}

这是：

<section id="question" [ngClass]="!answer ? 'unanswered': 'answered'">

或者这个：

<section id="question" [style.border]="!answer ? 'border: 2px solid blue !important': 'border: 2px solid gray !important'">

您正在尝试将类指定给样式。这样不行。尝试过之后，它们最初都显示为蓝色，但不会变为灰色。请尝试为运算符使用实际的布尔变量。“answer”听起来不像布尔值。yes answer是数字[]如果是数字，为什么要使用“！answer”语法而不是“answer==0”？这可能不是你的问题，但它更好的编码。编辑我的答案，去掉htmlOk中的美元符号这似乎可以做到：

<section id="question" [style.border]="!answer ? 'border: 2px solid blue !important': 'border: 2px solid gray !important'">