Question

我正在使用Ionic2，并拥有ion-content标记。根据变量，我想更改标签上的样式。

我尝试了以下操作，但它不起作用：

<ion-content *ngIf="persoModel.type === 0" padding class="person-content-wanted">
<ion-content *ngIf="personModel.type === 1" padding class="person-content-offered">
...
</ion-content>

任何人都可以建议你实现这个目标吗？

由于

Answer 1

这里personModel是一个布尔值，如果它是真的你将获得person-content-wanted类，如果它是假的，你会得到person-content-offerred

 <ion-content [class]="personModel? 'person-content-wanted' : 'person-content-offered'">

Answer 2

根据Ng2 docs，只是为了添加其他方法，使用ngClass的正确方法是

<some-element [ngClass]="{'first': true, 'second': true, 'third': false}">...</some-element>

所以在你的情况下它应该通过以下方式工作：

<ion-content padding [ngClass]="{'person-content-wanted': persoModel.type === 0, 'person-content-offered': personModel.type === 1}"]>
...
</ion-content>

CSS改变风格

2 个答案: