Как отобразить данные в ionic 3?

Question

Я не могу отобразить данные в ионном режиме. Как я могу отобразить данные в ionViewWillEnter и использовать метод post в laravel API?

Я попытался вызвать данные с помощью console.log, чтобы проверить, есть ли данные или нет. Я попытался "console.log (this.id);" до this.authService в ionViewWillEnter, как показано ниже.

kprofile.ts

ionViewWillEnter(){
        this.authService.postData(this.id,'viewProfileClinic').then((result) => {
          this.responsedata = result;
          console.log(result);
              this.usersClinic.email = this.responsedata.email;
                this.usersClinic.telno = this.responsedata.telno;
                this.clinic_regno = this.responsedata.clinic_regno;
                this.clinic_name = this.responsedata.clinic_name;
                this.site = this.responsedata.site;
                this.clinic_address = this.responsedata.clinic_address;
                this.zip = this.responsedata.zip;
                this.city = this.responsedata.city;
                this.state = this.responsedata.state;
        },(err) =>{

        });
  }

как я вижу в console.log результат

нет данных клиники

Я управляю ионной подачей.

ниже API .api

    //VIEW ALL CLINIC PROFILE
        public function viewProfileClinic(Request $request)
        {
            $id =$request->id;
            $clinicID = $request->clinic_id;

            $count = RegisterClinic::where('clinic_id',$clinicID)->count();
            if($count == 1)
            {
                $clinicData = RegisterClinic::where('clinic_id',$clinicID)->first();        
                $callEmailTelno = User::where('id',$clinicData->uid)->first();

                $datamsg = response()->json([
                        'calldata' => 'Email:'.$callEmailTelno->email.' Telno:'.$callEmailTelno->telno
                                     .' Clinicregno:'.$clinicData->clinic_regno.' Clinicname:'.$clinicData->clinic_name
                                     .' Site:'.$clinicData->site.' Clinicaddress:'.$clinicData->clinic_address
                                     .' Zip:'.$clinicData->zip.' City:'.$clinicData->city.' State:'.$clinicData->state

                    ]);
                    return $datamsg->content();
            }
            else{

                $datamsg = response()->json([
                    'error' => array("text"=>"No clinic data.")
                ]);
                return $datamsg->content();
            }
        }

Это то, что я хочу, чтобы оно отображалось в ионном формате в файле .html.

.html

<ion-list>
<p>Clinic Profile</p>
 <form #f="ngForm" (ngSubmit)="onSubmit(f)" class="list-form">
        <ion-item>
        <ion-label stacked>Clinic Email</ion-label>
        <ion-input type="text" name="usersClinic.email" [(ngModel)]="usersClinic.email">{{usersClinic.email}}</ion-input>
        </ion-item>

        <ion-item>
        <ion-label stacked>Telephone no.</ion-label>
        <ion-input type="text" name="usersClinic.telno" [(ngModel)]="usersClinic.telno">{{usersClinic.telno}}</ion-input>
        </ion-item>

        <button ion-button color="light" class="transparent-button" [disabled]="!f.valid" text-center round>
          Edit
        </button>
      </form>
      <ion-item>
        <p>Clinic Registration no</p>
        {{clinic_regno}}
      </ion-item>
      <ion-item>
          <p>Clinic Name</p>
          {{clinic_name}}
      </ion-item> 
      <ion-item>
          <p>Clinic Site</p>
          {{site}}
      </ion-item>
      <ion-item>
          <!-- <p>Clinic Address</p>  -->
          <ion-label primary>Clinic Address</ion-label>
           <!-- <ion-textarea>{{clinic_address}},{{zip}},{{city}},{{state}}.</ion-textarea> -->
           <ion-textarea rows="6" disabled [value]="clinic_address" ></ion-textarea>
      </ion-item>


    </ion-list>

Ответ API в почтальоне, как показано ниже.

{"calldata": "Электронная почта: jumin@hu.cm Телно: 0148232323 Clinicregno: 87234824 Название клиники: Klinik Ikhlas Сайт: www.wuu Адрес клиники: Центральный рынок UTC Почтовый индекс: 87000 Город: Лабуан Штат: Wilayah Persesekutuan Labuan"}

Ниже мой authService.ts файл, в который я положил свой метод postData.

postData(credentials, type) {

    let headers = new Headers({
      'Content-Type': 'application/json'
    });
    let options = new RequestOptions({ headers: headers });

    return new Promise((resolve, reject) => {
      this.http.post(apiUrl + type, JSON.stringify(credentials), options)
        .toPromise()
        .then((response) => {
          console.log('API Response : ', response.json());
          resolve(response.json());
        })
        .catch((error) => {
          console.error('API Error : ', error.status);
          console.error('API Error : ', JSON.stringify(error));
          reject(error.json());
        });
    });
  }

Answer 1

Не уверен, что это сработает для вас, но для моего ответа API он также появился как json, но вместо того, чтобы извлекать его как json, я запустил:

this.responsedata = (JSON.stringify (result));

Тогда

this.responsedata = JSON.parse (this.responsedata);

Также,другая возможность может быть API, неправильно форматирующим данные.Я уверен, что вы повторили свои данные в API, но там может быть проблема с чем-то, потому что вы получаете обратный вызов else.Поэтому, возможно, начнем с утверждения if.

PS- Иногда заголовки могут быть проблемой, если они неправильно отформатированы, если вы передаете токен или любой тип данных в заголовки, иногда Angular / Ionic немного более чувствителен, чем почтальон к данным.