Primeng动态表单下拉列表(DynamicSelectModel)设置数据问题

时间:2019-03-15 12:04:59

标签: angular angular2-forms primeng primeng-dropdowns

Here I am using prime ng dynamic form.

型号

 dynamicSelectModelBirims: SelectModel[] = [];

 export class SelectModel {
    label: string;
    value: any;
 }

构造函数

constructor(private formService: DynamicFormService, private helperService: HelperService,
    private birimlerService: BirimlerService) {

    setTimeout(() => {
      this.dynamicFormCreate();
      this.formGroupValue = this.formService.createFormGroup(this.formModel);

    }, 100);

    setTimeout(() => {
      this.getBirims();

    }, 1000);

  }

新的DynamicSelectModel

 FORM_MODEL.push(new DynamicSelectModel<string>({
      id: element.propertyName,
      label: element.displayName,
      placeholder: element.displayName,
      options: this.dynamicSelectModelBirims, // or this.getBirims();

      //value: "Aktif",
      //disabled: false,

    }))

getBirims(){}和DynamicSelectModel推送

 getBirims() {
this.birimlerService.get().subscribe(
  (data: any) => {
    if (data.statusCode == 200) {
      this.birimler = data;


      this.birimler.data.forEach(element => {
        this.dynamicSelectModelBirims.push({
          label: element.birimAdi,
          value: element.id
        });
      });
    }
  }
);

HTML

 <div class="overflow-hidden content-margin content-padding" style="width: 100%;">
    <!-- <pre>{{ dynamicform | json }}</pre> -->
    <form [formGroup]="formGroupValue" class="ui-fluid" style="align-content: center">

        <dynamic-primeng-form [group]="formGroupValue" [layout]="layoutJson" [model]="formModel"
            (change)="onChange($event)" (pEvent)="onPEvent($event)"></dynamic-primeng-form>

    </form>

    <!-- <button type="button" class="" icon="pi pi-check"  label="Kaydet"></button> -->

</div>

empty dropdown image

  

我在上面提供了代码示例的动态表单必须在加载html页面之前先加载下拉数据。但是由于先前已安装了html页面,因此在该服务将数据设置为对象之前,该页面正以空下拉列表加载。因此,下拉列表为空。但是,当我使用console.log打印时,dynamicSelectModelBirims对象具有数据。我该如何解决这个异步问题?

0 个答案:

没有答案