离子2：添加类到项目，同时删除其他项目类

我有一个完整的按钮，点击时，应该添加一个类（selected-date-item），改变按钮的颜色。在此之前，我想从任何以前拥有该类的按钮中移除该类（selected-date-item）。离子2：添加类到项目，同时删除其他项目类

CSS

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

HTML

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

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

来源

2017-07-26 maudulus

类似<跨度* ngFor = “让possibleDates的chooseDate”><按钮类= “日期 - 时间 - 选择”（抽头）=“selectPickupDate （chooseDate）“[ngClass] =”chooseDate == selectedDate）？'selected-date-item'：'“> – Rienk

@Rienk有点混乱 - 是否有需要关闭的括号？ – maudulus

是的，需要打开括号：[ngClass] =“ - >（< - chooseDate == selectedDate）？'selected-date-item'：'” – Rienk

使用[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}"

来源

2017-07-26 22:35:54 robbannn

离子2：添加类到项目，同时删除其他项目类

回答

相关问题