如何使用if语句更改角度样式属性[重复]

Posted

技术标签:

【中文标题】如何使用if语句更改角度样式属性[重复]【英文标题】:How to change style property in angular with if statement [duplicate] 【发布时间】:2019-06-27 07:28:33 【问题描述】:

下面的问题是角度 7

<header class="stick-top forsticky gradient">

这是我的 html 角度内容

current_path = localStorage.getItem("current_path");

当前路径是我组件中的一个变量。

我想在组件中设置 if current_path != '/' then heder会是这样的。

<header class="stick-top forsticky gradient">

否则

<header class="stick-top forsticky">

如果我的 current_path 是 '/',我想从 hrader 标记中删除渐变类

【问题讨论】:

【参考方案1】:

如果它是一个单一的类,一个足够好的替代 ngClass 是

<header class="stick-top forsticky" [class.gradient]=" current_path != '/' " >

您可能更喜欢这种语法,因为它比解析为类的 js 对象更容易在 html 模板中格式化和美化。

【讨论】:

【参考方案2】:

你可以使用 ngClass:

<header class="stick-top forsticky" [ngClass]="'gradient':current_path != '/'">

【讨论】:

以上是关于如何使用if语句更改角度样式属性[重复]的主要内容,如果未能解决你的问题,请参考以下文章

如何更改图像.svg的样式[重复]

如何使用 JavaScript 更改样式属性中的一个值?

如何从 ViewModel 更改样式属性?

是否可以使用样式组件中的 if 语句切换 css 属性的值?

如何仅使用样式属性分配 a:hover、a:visited 等 [重复]

如何删除样式属性[重复]