api数据未显示在html页面

Question

我只是试图显示我在离子应用程序的hmtl上构建的API中的数据，但由于某种原因，数据没有显示在页面上。当我在邮递员中调用api中的数据时，它会按预期显示，以及当我在.ts文件中调用console.log(data)时打印出来，但不会显示在网页上。我不清楚问题是什么。

以下是我的.ts文件：

import { Component } from '@angular/core';
import { NavController, AlertController } from 'ionic-angular';
import { AllPatientsPage } from '../all-patients/all-patients';
import { RestService } from '../../providers/rest-service/rest-service';
import { ShareServiceProvider } from '../../providers/share-service/share-service';

@Component({
  selector: 'page-medHist',
  templateUrl: 'medHist.html'
})
export class MedHist {
   patientID: any;
   medicalHistory: any;
   obField: any;
   gynField: any;
   pmhField: any;
   pshField: any;
   medsField: any;
   allField: any;
   shField: any;

   constructor(private navCtrl: NavController, public shareService: ShareServiceProvider, public restService: RestService) {
      this.patientID = this.shareService.getSinglePatientID();
   }

    ionViewWillEnter() {
        this.patientID = this.shareService.getSinglePatientID();
        console.log("patient testID");
        console.log(this.patientID);
        this.populatePage(this.patientID);
    }

    populatePage(id){
        console.log("single-test populate page testID");
        console.log(id);
        this.restService.getMedHist(id)
        .then(data => {
            console.log("patient data");
            console.log(data);
            this.medicalHistory = data;
            this.obField = this.medicalHistory.ob;
            this.gynField = this.medicalHistory.gyn;
            this.pmhField = this.medicalHistory.pmh;
            this.pshField = this.medicalHistory.psh;
            this.medsField = this.medicalHistory.meds;
            this.allField = this.medicalHistory.allVal;
            this.shField = this.medicalHistory.sh;
            console.log("data assigned");

        }).catch(e => {
            console.log(e);
        }); 
    }
}

下面是html：

<ion-content>
    <ion-grid class="add-patient-border" text-left>
        <ion-row align-items: left>
            <ion-col col-auto>
                <ion-label> OB: </ion-label>
            </ion-col>
            <ion-col style="max-width: 30%">
                <ion-input style="font-style: underline" readonly="true" [(ngModel)] = "obField"></ion-input>   
            </ion-col>
        </ion-row>
        <ion-row align-items: left>
            <ion-col col-auto>
                <ion-label> GYN: </ion-label>
            </ion-col>
            <ion-col>
                <ion-input readonly="true" [(ngModel)] = "gynField"></ion-input>
            </ion-col>
        </ion-row>
        <ion-row align-items: left>
                        <ion-col col-auto>
                                <ion-label> PMH: </ion-label>
                        </ion-col>
                        <ion-col>
                                <ion-input readonly="true" [(ngModel)] = "pmhField"></ion-input>
                        </ion-col>
                </ion-row>
        <ion-row align-items: left>
                        <ion-col col-auto>
                                <ion-label> PSH: </ion-label>
                        </ion-col>
                        <ion-col>
                                <ion-input readonly="true" [(ngModel)] = "pshField"></ion-input>
                        </ion-col>
                </ion-row>
        <ion-row align-items: left>
                        <ion-col col-auto>
                                <ion-label> MEDS: </ion-label>
                        </ion-col>
                        <ion-col>
                                <ion-input readonly="true" [(ngModel)] = "medsField"></ion-input>
                        </ion-col>
                </ion-row>
        <ion-row align-items: left>
                        <ion-col col-auto>
                                <ion-label> ALL: </ion-label>
                        </ion-col>
                        <ion-col>
                                <ion-input readonly="true" [(ngModel)] = "allField"></ion-input>
                        </ion-col>
                </ion-row>
        <ion-row align-items: left>
                        <ion-col col-auto>
                                <ion-label> SH: </ion-label>
                        </ion-col>
                        <ion-col>
                                <ion-input readonly="true" [(ngModel)] = "shField"></ion-input>
                        </ion-col>
                </ion-row>
    </ion-grid>
</ion-content>

下面的

是rest-services提供者类：

//below gets the medical history of a specific patient based on the patientID
getMedHist(id) {
    return new Promise(resolve => {
        this.http.get('/getMedHist/' + id)
        .subscribe(data => {
            console.log("rest-services.ts medHistory");
            this.data = data;
            console.log(this.data);
            resolve(this.data);
        });
    });
}