Ionic 2：向项目添加类，同时从其他项目中删除类

Question

我有一个充满按钮的 div，当单击这些按钮时，应该添加一个类 ( selected-date-item) 来更改按钮的颜色。在此之前，我想从selected-date-item之前包含该类的任何按钮中删除该类 ( )。

CSS

.selected-date-item {
  background:#272829;
  color:white;
}

超文本标记语言

<button class="date-time-select" *ngFor="let chooseDate of possibleDates" (tap)="selectPickupDate(chooseDate)">{{chooseDate}}</button>

JS

selectPickupDate(selectedDate) {
  this.selectedDate = selectedDate;
}

=>

Answer 1

使用[ngClass]-directive 动态设置 CSS 类。

<button [ngClass]="{'selected-date-item': chooseDate == selectedDate, 'not-selected-item': chooseDate != selectedDate}" *ngFor="let chooseDate of possibleDates" (tap)="selectPickupDate(chooseDate)">{{chooseDate}}</button>

[ngClass]打破：

[ngClass]="{'selected-date-item': chooseDate == selectedDate, 'not-selected-item': chooseDate != selectedDate}"