Question

您好，我目前正在开发一个Ionic应用程序，该应用程序必须通过SOAP ReadData获得后才能向用户显示Form Group中的一些数据。

我正在调用我的函数，然后将数据显示到表单中，唯一的问题是表单未显示。

constructor(
  public navCtrl: NavController,
  public navParams: NavParams,
  private privacyProvider: PrivacyProvider,
  private formBuilder: FormBuilder
  ) {

  this.myParam = navParams.get('myParam');

  console.log(this.myParam);

  this.getAnagrafica().then(() => {
    console.log(this.iobAnagrafica);
    debugger;
    this.formAnagrafica = this.formBuilder.group({
      ID_INSTALLATO: new 
 FormControl(this.iobAnagrafica.id_installato),
      ID_ANAGRAFICA: new FormControl(this.iobAnagrafica.id_anag),
      ID_PRODUTTORE: new 
 FormControl(this.iobAnagrafica.id_produttore),
      ID_GRUPPO: new FormControl(this.iobAnagrafica.id_gruppo),
      ID_INSTALLATORE: new 
 FormControl(this.iobAnagrafica.id_installatore)
      });
   });

 }

 getAnagrafica(){
  return new Promise((resolve, reject) =>{


this.privacyProvider.getIOBAnagrafica(this.myParam).subscribe((data)=> {
   if (data) {
     this.iobAnagrafica = data;
     resolve(true);
   } else {
      reject();
   }
 })
});
}

如何解决此错误？这是我的HTML：

<ion-content>
<ion-list *ngIf="formLoaded">
<form [formGroup]="formAnagrafica">
  <ion-item>
    <ion-label stacked>ID INSTALLATO</ion-label>
    <ion-input formControlName="ID_INSTALLATO" type="text"></ion-input>
  </ion-item>
  <ion-item>
    <ion-label stacked>ID ANAGRAFICA</ion-label>
    <ion-input formControlName="ID_ANAGRAFICA" type="text"></ion-input>
  </ion-item>
  <ion-item>
    <ion-label stacked>ID PRODUTTORE</ion-label>
    <ion-input formControlName="ID_PRODUTTORE" type="text"></ion-input>
  </ion-item>
  <ion-item>
    <ion-label stacked>ID GRUPPO</ion-label>
    <ion-input formControlName="ID_GRUPPO" type="text"></ion-input>
  </ion-item>
  <ion-item>
    <ion-label stacked>ID INSTALLATORE</ion-label>
    <ion-input formControlName="ID_INSTALLATORE" type="text"></ion-input>
  </ion-item>
</form>

Answer 1

似乎您从未将formLoaded标志设置为true。

尝试一下：

this.getAnagrafica().then(() => {
    console.log(this.iobAnagrafica);
    debugger;
    this.formAnagrafica = this.formBuilder.group({
      ID_INSTALLATO: new 
 FormControl(this.iobAnagrafica.id_installato),
      ID_ANAGRAFICA: new FormControl(this.iobAnagrafica.id_anag),
      ID_PRODUTTORE: new 
 FormControl(this.iobAnagrafica.id_produttore),
      ID_GRUPPO: new FormControl(this.iobAnagrafica.id_gruppo),
      ID_INSTALLATORE: new 
 FormControl(this.iobAnagrafica.id_installatore)
      });

      this.formLoaded = true;
   });

Answer 2

我认为您应该使用 ngModel ：https://ionicframework.com/docs/developer-resources/forms/ 在您的ts中声明一个变量

public callBack;
constructor(
  public navCtrl: NavController,
  public navParams: NavParams,
  private privacyProvider: PrivacyProvider,
  private formBuilder: FormBuilder
  ) {

  this.myParam = navParams.get('myParam');

  console.log(this.myParam);

  this.getAnagrafica().then((chart) => {
    this.callBack = chart;
 }
...

此后，它应该显示在字段中，您也可以将 callBack 变量用于ngIf

<ion-content>
<ion-list *ngIf="callBack">
<form [formGroup]="formAnagrafica">
  <ion-item>
    <ion-label stacked>ID INSTALLATO</ion-label>
    <ion-input [(ngModel)]="callBack.id_installato" formControlName="ID_ANAGRAFICA" type="text"></ion-input>
  </ion-item>
...

在Ionic 3中承诺后不返回任何数据

2 个答案: