CODEWITHSUNDEEP
angulartypescriptangular-ngselect
Kumara
Kumara

Reputation: 528

ng-select - Data not loading correctly according to JSON

I am trying to load drop-down data using the below function. (using ng-select library)

loadBranches() {
  this.registrationService.getBranchName().subscribe(data => {
    console.log(data);
     this.branchModel$ = data['data']['branchArr'];

  });
}

Currently, my console log data is loaded correctly. please check the below screenshot:

enter image description here

This is my HTML code.

<ng-select [items]="branchModel$ | async" bindLabel="branchName" required
    (change)="getBankInfo($event);" name="branchName" bindValue="title"
     placeholder="Select Branch" [(ngModel)]="reserve.branchName">
</ng-select>

but this approach did not work. Can you help me to load this drop-down?

Upvotes: 0

Views: 579

Answers (1)

Yong Shun
Yong Shun

Reputation: 51325

Expect that branchModel$ is Observable<any[]> type.

Solution

Hence you need to cast your array as Observable with of rxjs operator.

import { of } from 'rxjs';

this.branchModel$ = of(data['data']['branchArr']);

Sample Solution on StackBlitz

Upvotes: 2

Related Questions