與條件Angular2應用CSS類

Question

我想申請一類COL-MD-9，如果displaysidebar是真實的其他類應該是COL-MD-12

這是我所嘗試，但無法工作

<div class=" displaysidebar ? col-md-9 : col-md-12 "> 

我在哪裏出錯了？

Answer 1

可以做兩種方式：

<div [ngClass]="{'col-md-9': displaysidebar, 'col-md-12': !displaysidebar} "> 

或

<div [ngClass]="displaysidebar? 'col-md-9': 'col-md-12';"> 

Answer 2

它應該是這樣的

模板

<div [ngClass]="(displaysidebar) ? 'col-md-9': 'col-md-12' "> 

組件

export class App { 
     displaysidebar : boolean; 
     constructor() { 
     this.displaysidebar = true; 
     } 

    } 

Answer 3

您需要使用NgClass與property binding一起。

<div [ngClass]="displaysidebar ? 'col-md-9' : 'col-md-12'">