Ion-select inside list

@ankitkaushik wrote:

Hi,

I am using ion-select inside ion-list where each item has a select option. When i want to change the value using select option of one item then it automatically changes the value of items in whole list. I believe, i will have to limit the scope of ion-select inside one item only but not sure what will be the right way to handle that. Here is my code snippet:

HTML Code:

<ion-card card-bcg *ngFor="let item of items | async">
    <input type="hidden" [(ngModel)]="item.$key" />
    <ion-list>
      <ion-item no-margin  background-size item-bcg text-wrap *ngIf="role=='admin' || role=='teacher'" (tap)="goToItemProfile(item)">
        <ion-avatar item-left>
          <img [src]="item?.profilepic">
        </ion-avatar>
        <h2 item-title>{{item?.displayName}}</h2>
      </ion-item>
      <ion-item>
        <ion-label>Select options</ion-label>
        <ion-select [(ngModel)]="attendance" (ionChange)="onChange(attendance, item)">
          <ion-option value="present">Present</ion-option>
          <ion-option value="absent">Absent</ion-option>
        </ion-select>
      </ion-item>
    </ion-list>
  </ion-card>

Here is the onChange Code:

onChange(attendance, item) {
    console.log(this.attendance);
    this.key = item.$key;
    this.attendancedetails = this.db.object('/attendance/' + this.key);
    this.presentOn = this.db.list('/attendance/' + this.key + '/presentOn');

    var presentOnUpdate = {
      attendance: this.attendance,
      date: firebase.database['ServerValue']['TIMESTAMP'],
      markedBy: this.userData.uid,
      markerName: this.displayName
    }
    this.presentOn.push(presentOnUpdate).then(data => {
      //console.log(this.item.uid);
    });
  }

Please suggest the right way to handle this issue…

Posts: 1

Participants: 1

Read full topic