无法将数据与角度 2 中的 ion-item 绑定

Question

在ionic-2 和angular 2 上工作，我得到了一个对象数组，其中我得到了一个人的详细信息。

我已经声明了一个 var dataObj:any 来分配我从我的对象中获得的值。我什至已成功地将值分配给对象，但我仍然无法在 HTML / 模板中显示或绑定这些值

类：

export class DetailsPage {
  id: any;
  public dataObj: any;

  constructor(public navCtrl: NavController, public navParams: NavParams, public absService: AbsconderService, public posService: PosService) {   
     this.id = navParams.get('id'); 
     this.getData(this.id)
  }

   getData(id) {
    this.absService.getAbsconderById(id)
      .then(data => {
        this.dataObj = {
          name : data.data[0].name,
          nic : data.data[0].nic,
          fname: data.data[0].fname,
          caste: data.data[0].caste,
          residence: data.data[0].residence,
          crime_no: data.data[0].crime_no,
          us: data.data[0].us,
          ps: data.data[0].ps
        }
           console.log(this.dataObj);  
      })
  };


  ionViewDidLoad() {
    console.log('ionViewDidLoad Details');
  }

}

模板

<ion-content padding>
  <ion-grid>
    <ion-row>

      <ion-col col-12>
        <img class="background-image-sp" src="assets/images/avtar.png" />
      </ion-col>
    </ion-row>
  </ion-grid>

  <ion-item>
    <ion-label stacked>Name</ion-label>
    <ion-label>{{dataObj.name}}</ion-label>
  </ion-item>

  <ion-item>
    <ion-label stacked>NIC No.</ion-label>
    <ion-label>{{dataObj.nic}}</ion-label>
  </ion-item>
</ion-content>

Answer 1

可能是因为您在构造函数中进行了异步调用，因此页面呈现的时间还为时过早，无法响应返回？？我在 Ionic 3 中也遇到过这种情况...您会期望数据绑定在其值更改时会自行更新...但有时您需要使用

手动调用该更改

import { ChangeDetectorRef } from '@angular/core';

将此对象分配给构造函数中的属性：

constructor(public navCtrl: NavController, public navParams: NavParams, public absService: AbsconderService, public posService: PosService, private changeDetector: ChangeDetectorRef) {   
     this.id = navParams.get('id'); 
     this.getData(this.id)
}

然后在最后的 then 块中调用它

       getData(id) {
    this.absService.getAbsconderById(id)
      .then(data => {
        this.dataObj = {
          name : data.data[0].name,
          nic : data.data[0].nic,
          fname: data.data[0].fname,
          caste: data.data[0].caste,
          residence: data.data[0].residence,
          crime_no: data.data[0].crime_no,
          us: data.data[0].us,
          ps: data.data[0].ps
        }
           console.log(this.dataObj);
           changeDetector.detectChanges()
      })  
};

你可以试试这个。告诉我