ERROR Error: Error trying to diff '[object Object]'. Only arrays and iterables are allowed


#1

how do i order it to display this array in the dropdown??

my.html

 <ion-item>
               <img src="assets/img/travel/city.png" width="25" height="30" item-start>
                <ion-label stacked>Pilih Kota</ion-label>
                <ion-select [(ngModel)]="shuttledestination2" name="shuttledestination2" interface="action-sheet">
                    <ion-option *ngFor="let data of traveldest" value="{{ data.id }}"><b>{{ data.label }}</b></ion-option>
                  </ion-select>
              </ion-item>

#2

it’s not array. It is object of objects. Make it an array like
[{…},{…},{…}]


#3

oke, if this object then how do i show this data in dropdown?


#4

If you want to iterate over a object (map), you have to create a pipe that will convert it to array and render it through ngFor.

Search for angular pipes iterate over maps. This will guide you. Check this out


#5

can you place your ts code here
specially declaration of variable traveldest


#6

thismy.ts


    this.storage.get('data_m').then((prof) => {
      this.datauser = JSON.parse(prof);
      this.offset = 0;
      this.limit = 10;
      this.id =  this.datauser[0].id;
    this.authService.getAll('traveldest', this.id,this.shuttleagen,this.offset,this.limit).then((result) => {
      this.data = result;
     // this.travelcity = new Array<Object>(this.data);
      this.traveldest =  Object.values(this.data);
      console.log(this.traveldest);
      this.shuttledestination2 = 1;
    });
  });

#7

remove this parsing and then try,and what is purpose of this code.

this.traveldest = Object.values(this.data);

console this.data or result above this line. if it is same as your above pic console then you can direct assign it it this.traveldest

this.traveldest = this.data; or this.traveldest = result;