جاوااسکریپت - چگونه ngselect را در انگولار از قبل پر کنیم؟

من در حال دریافت برخی موارد از طریق یک تماس http هستم و سپس میخواهم ngselect را پیشپر کنم، اما استفاده از روش abstractcontrol.setvalue() به نظر نمیرسد کار کند.

کد قالب

<ng-select [items]="cars"
         bindValue="code"
         bindLabel="displayName"
         formControlName="car"
         [clearable]="false"
         [searchable]="false"
         id="car"
         placeholder="Select a car">

کد مؤلفه

this.setValueForPrePopulatedPlanningDetail('car', car);

private setDefaultValue(fieldName: string, value: any) {
    if (value && value.length > 0) {
    const field = this.myFormGroup.get(fieldName);
    field.markAsDirty();
    field.setValue(value);
    }
}

پاسخ شماره ۱

شما باید نتیجه خود را در فهرست (کشورها) تنظیم کنید و سپس از setvalue برای انتخاب گزینه استفاده کنید

نتیجه را در لیست خود در کامپوننتتان قرار دهید:

this.countries = ['XPTO','XPTO2','XPTO3']

موارد زیر را در HTML خود تعریف کنید:

<select>
   <option [value]="country" *ngFor="let country of countries">             {{country}}</option>
</select>

پاسخ شماره ۲

روش صحیح استفاده از ng-select این است که مقادیر را به اتصال ورودی items اختصاص دهید.

به عنوان مثال,

<ng-select [items]="cities2"
  bindLabel="name"
  bindValue="id"
  [multiple]="true"
  placeholder="Select cities"
  [(ngModel)]="selectedCityIds">
</ng-select>

و در فایل component.ts خود، گزینههای ng-select را با اشتراک در observable بازگردانده شده توسط درخواست HTTP پر خواهید کرد و آن را به ویژگی cities2 اختصاص خواهید داد.

cities2: any[] = [];

ngOnInit() {
  this.dataService.getData.subscribe(res => {
    this.cities2 = res;
  });
}

این دموی ممکن است مستقیماً به پرسشهای شما پاسخ ندهد، اما نشان میدهد که چگونه اتصالات ورودی مختلف (مانند items) با ng-select کار میکنند.