我有一个 NgStyle 标签,我想在其中使用多个条件,但要么它不起作用,要么我收到错误。
到目前为止,这是我的代码:
<div class = "card" [ngStyle]="{'height': Card.duration.Hours == 1 ? '130px': height}"
[ngStyle]="{'height': Card.duration.Hours < 1 ? '100px': height}"
>
但只有第一个条件有效,当我想混合这些条件时,我收到错误。我怎么能有多个条件?
最佳答案
您不能在一个 div
标签中使用多个 [ngStyle]
。使用 [ngClass]
代替。
下面是我的示例。
HTML
<div [ngClass]="{ 'height100': hours === 1, 'height200': hours === 2, 'height300': hours === 3}">
test
</div>
TS
export class AppComponent {
hours: number = 3;
constructor () {
}
}
CSS
.height100 {
height: 100px;
background: red;
}
.height200 {
height: 200px;
background: yellow;
}
.height300 {
height: 300px;
background: green;
}
关于css - 在单个 NgStyle 标签中混合多个条件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56684834/