Question

ng-class指令无法编译，并且在检查器中可见，在运行时可见。

ts脚本

export class TotalPage {

  showClass: boolean;

  constructor(public navCtrl: NavController ,public http: Http) {

        this.showClass = false;

  }

}

HTML

<ion-header>

  <ion-navbar>
    <ion-title>Total</ion-title>
  </ion-navbar>

</ion-header>

<ion-content padding>
  <div ng-class="{expenceBg:showclass}">Test</div>  
</ion-content>

SCSS

$expence-bg: #ffcccc;
$income-bg: #00cccc;
page-total {
    .expenceBg{
        background-color: $expence-bg;
    }
    .incomeBg{
        background-color: $income-bg;
    }
}

.expenceBg{
        background-color: $expence-bg;
    }

因此，当我运行它时，它有Test，因此它不会编译“ng-class”部分。我做错了什么？

Answer 1

ng-class仅用于AngularJS，而不是Angular（2+）。请改用[ngClass]。

<ion-content padding>
  <div [ngClass]="{expenceBg:showclass}">Test</div>  
</ion-content>

Angular ng-class无法编译/工作

1 个答案: