Ionic 3: нет ответа на вызов REST API

вот моя проблема:

У меня есть эта конечная точка (GET), которая в результате дает мне объект JSON: «localhost: 3305/v1/patients». Я использую Ionic 3 с провайдером «RestProvider».

Мой rest.js выглядит так:

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';

@Injectable()
export class RestProvider {
    apiUrl = 'localhost:3305/v1';
    constructor(public http: HttpClient) {
        console.log('Hello RestProvider Provider');
    }

    getPatients() {
        return new Promise(resolve => {
            this.http.get(this.apiUrl+'/patients').subscribe(data => {
                resolve(data);
                console.log(data);
            }, err => {
                console.log(err);
            });
        });
    }
}

дом.тс:

import { Component } from '@angular/core';
import { RestProvider } from '../../providers/rest/rest';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})

export class HomePage {
    patients: any;
  constructor (public restProvider: RestProvider) {
     this.getPatients();
    }

    getPatients() {
        this.restProvider.getPatients()
        .then(data => {
            this.patients = data;
            console.log(this.patients);
        });
    }
}

домашний.html:

<ion-content>
  <ion-navbar>
    <ion-title>My patients</ion-title>
  </ion-navbar>
  <ion-list>
    <ion-list-header>My patients</ion-list-header>
  </ion-list> 
  <ion-list inset>
    <ion-item *ngFor="let patient of patients">
      <p>{{patient}}</p>
    </ion-item>
  </ion-list>
</ion-content>

Проблема: ошибки нет, но в представлении ничего не отображается. console.log(данные); из rest.js показывает: [объект Объект].

Кто-нибудь знает, где ошибка? В связи с этим спасибо!


person 1989_lea    schedule 19.09.2018    source источник
comment
Возвращает ли он какие-либо данные, когда вы пытаетесь использовать почтальон или завиток?   -  person Mac_W    schedule 19.09.2018
comment
да, конечная точка работает нормально. Я уже протестировал его через Postman.   -  person 1989_lea    schedule 19.09.2018
comment
Вам не нужно использовать промисы в Angular, поскольку HttpClient использует наблюдаемые объекты. Попробуйте удалить функцию обещания   -  person Mac_W    schedule 19.09.2018


Ответы (3)


Необходимо переписать getPatients() код следующим образом:

getPatients() {
    return this.http.get(this.apiUrl+'/patients', {
      headers: new HttpHeaders().set('Content-Type', 'application/json'),
    })
   .toPromise()
}

И Получение данных в home.ts

getPatients() {
    this.restProvider.getPatients().then((res => { 
        this.patients = data;
    }, (err) => {
       console.log("rejected"); 
    })
}
person Utpaul    schedule 19.09.2018

Поскольку вы используете современный Angular, вы должны использовать методы http в соответствии с документами:

В вашей службе:

getPatients() {
            return this.http.get(this.apiUrl+'/patients')
}

В вашем компоненте:

getPatients() {
        this.restProvider.getPatients()
        .subscribe(data => {
            this.patients = data;
            console.log(this.patients);
        });
    }

В основном используйте наблюдаемые, как указано в комментариях.

person Sergey Rudenko    schedule 19.09.2018

Не забудьте разобрать ответ из json, например, так или так, как вы предпочитаете.

getPatients() {
    return new Promise((resolve, reject) => {
        this.http.get(`${this.apiUrl}/patients`).subscribe(data => {
            try {
               response = response.json();
               resolve(response);
            } catch (error) {
               console.log('[api-153]', response);
               reject(response);
            }
            console.log(data);
            resolve(data);
        }, err => {
            console.log(err);
        });
    });
}
person Juan Lozoya    schedule 19.09.2018