如何将 css 规则应用于整个页面选择器类 ionic2

Question

我想在整个ionic2选择器类上应用特定的css类，而不是在ion-content上。

例如，我有一个带有选择器的页面：

selector: 'home-page'

现在我想通过 ionic2 页面内的 TS 函数切换一个 css 规则（切换一个类"调整页面大小"）。因此，每次我按下按钮时，它都会将此类添加或切换到整个页面选择器。

Answer 1

你可以使用 ngClass：

<ion-content [ngClass]="getClass()">
</ion- content>

在您的 .ts 文件中：

buttonClickedTimes = 0;
getClass(): string {
    // based on how many times the button is clicked
    // return 'class-1' or 'class-2' 
    this.buttonClickedTimes % 2 == 0 ? 'class-1' : 'class-2';
}
clickButton(): void {
    this.buttonClickedTimes ++;
}

或者，正如iWork在评论中建议的那样：

<ion-content [class]="buttonClickedTimes%2 === 0 ? 'class-1' : 'class-2'"></ion-content>