1. ホーム
  2. angular

[解決済み] ngClassで複数の条件を設定する - Angular 4

2022-03-03 05:57:40

質問

ngClassで複数の条件を使用するには?例

<section [ngClass]="[menu1 ? 'class1' : '' || menu2 ? 'class1' : '' || (something && (menu1 || menu2)) ? 'class2' : '']">

というような感じです。2つのメニューに同じクラスがあり、どちらかのメニューがtrueで'something'がtrueの時にクラスが必要です。十分な説明ができたでしょうか?

解決方法は?

ngClass に配列を代入しようとしていますが、配列の要素を || ではなく , .

これを試してみてください。

<section [ngClass]="[menu1 ? 'class1' : '',  menu2 ? 'class1' : '', (something && (menu1 || menu2)) ? 'class2' : '']">

この他のオプションも動作するはずです。

<section [ngClass.class1]="menu1 || menu2" [ngClass.class2] = "(menu1 || menu2) && something">