Как связать данные API в NG-Multiselect-выпадающего?

Question

Я хочу связать данные в выпадающий список с несколькими вариантами, как это возможно?

HTML код:

<div class="form-group">
    <!--
    <select class="form-control custom-selec" formControlName='stoppage_point'>  
        <option *ngFor="let cities of city.data" [(ngValue)]="cities.city">{{cities.city}}</option>  
    </select>
    -->
    <ng-multiselect-dropdown
        name="city"
        [placeholder]="'Select City'" 
        [data]="city.data" 
        formControlName="city" 
        [disabled]="disabled" 
        [settings]="dropdownSettings" 
        (onSelect)="onItemSelect($event)">
    </ng-multiselect-dropdown>
</div>

.ts код файла:

this.http.get(environment.api_url + `/admin/get_only_city/`
).subscribe((data:any[])=> {
  console.log(data);
  this.city = data;
  var i; 
  for(i=0;i<=8;i++){
    console.log(this.city.data[i]['_id']) ;
  }

  this.dropdownSettings = {
    singleSelection: false,
    selectAllText: 'Select All',
    unSelectAllText: 'UnSelect All',
    itemsShowLimit:5,
    allowSearchFilter: true
  };
});

Я хочу отобразить все записи в раскрывающемся списке, но значения не отображаются.

Я не знаю, как связать определенное значение в данных, поэтому, пожалуйста, может кто-нибудь помочь мне решить эту проблему?

Answer 1

Пожалуйста, проверьте мой пример Stackblitz

Вы вызываете веб-сервис и извлекаете данные результатов в массив.И этот массив вы помещаете в свой выпадающий список.

  getData(): void {
    let tmp = [];
    this.http.get<any>('https://jsonplaceholder.typicode.com/users').subscribe(data => {
      for(let i=0; i < data.length; i++) {
        tmp.push({ item_id: i, item_text: data[i].name });
      }
      this.dropdownList = tmp;
    });
  }