javascript - 单击时选择列表中的第一项

Question

我有一个列表，当我选择最后一项时，我想选择列表的第一项。

有没有办法做到这一点？

请问有办法处理吗？

<ion-select interface="popover" [ngModel]="selecteduser._id" (ngModelChange)="selectUser($event)" (ionChange)="onChange($event)">
    <ion-option *ngFor="let user of users" [value]="user._id">
      </ion-content>{{ getUserNickname(user }} </ion-option>
    <ion-option>Configuration</ion-option>
</ion-select>

所以我想当我点击我的配置时，它会选择我列表的第一项

有我的ts

openConfigPage() {
    this.selectedUser = this.users[0];
    this.navCtrl.push(ConfigPage)
}

selectUser(userId: string) {
    this.selectedUser = this.users.find(b => b._id === userId)
    this.onSelect.emit(this.selectedUser)
}

有没有办法用 DOM 做到这一点？

标签： javascriptangulardomionic-framework

Answer 1

模板

Select Last One <select [(ngModel)]="selectedItem" (ngModelChange)="onSelect($event)">
  <option *ngFor="let item of items" [value]="item">{{item}}</option>
</select>

<br><br>
You have selected : {{selectedItem}}

零件

export class AppComponent  {
  selectedItem:string; 
  items = [
    'Purab', 'Pashchim', 'Uttar', 'Dakshin'
  ];

  onSelect(selectedItem) {
    let len = this.items && this.items.length;

    this.selectedItem = len && selectedItem === this.items[len-1]?
                          this.items[0]:selectedItem;
  }
}

演示：https ://ng-on-lastselect-checkfirst.stackblitz.io

来源：https ://stackblitz.com/edit/ng-on-lastselect-checkfirst