代码之家  ›  专栏  ›  技术社区  ›  maudulus

Ionic 2:将类添加到项中,同时从其他项中删除类

  •  5
  • maudulus  · 技术社区  · 8 年前

    我有一个充满按钮的div,单击它时,应该会添加一个类( selected-date-item 所选日期项目 )从以前持有该类的任何按钮。

    CSS

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

    HTML

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

    JS公司

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

    enter image description here => enter image description here

    1 回复  |  直到 8 年前
        1
  •  2
  •   maudulus    8 年前

    使用 [ngClass]

    <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}"