Наблюдаемый не возвращает ответ API - PullRequest
Новая
       13

Наблюдаемый не возвращает ответ API

0 голосов
/ 21 мая 2018

Я новичок в угловой.Мой проект в angular5, и я использую веб-API, созданный на PHP.Мой WebApi дает ответ в виде почтальона, но не с угловой.Я использую HttpClient для отправки запроса 

    export class GalleryComponent implements OnInit {
      private apiUrl = 'http://localhost:8080/fullpath';
      private response;
      private data=[];

      constructor(private http: HttpClient) {
        this.response =this.getCategory();
      }

      getCategory (): Observable<any> {
        return this.http.post(this.apiUrl,{});
      }

      ngOnInit() {
       console.log(this.response);
      }
  }

Моя консоль возвращает enter image description here

Что мне нужно сделать, чтобы получить правильный ответ от API?

Ответы [ 4 ]

0 голосов
/ 21 мая 2018

Отлично!Вы можете попробовать это 

this.getCategory().subscribe(
    response => console.log(response),
    err => console.log(err)
);

Но лучший способ использовать это, вам нужно создать сервис для POST-запроса, и вы просто называете его компонентом im.Вот так 

getCategory(data: any): Observable<any> {
 return this._http.post(`url`, JSON.stringify(data))
}

И используйте это в компоненте 

this.categoryService.getCategory(data).subscribe(
 data => console.log(data),
 err => console.log(err)
)

И вы можете использовать Google DevTools, чтобы увидеть, работает ли запрос, и увидеть ответ на запрос!В network!Если проблема в CORS, вам необходимо установить домен CORS на вашем сервере!Попробуйте и скажите мне, если сработало!Надеюсь, это поможет!Спасибо

0 голосов
/ 21 мая 2018

Вы должны подписаться на Observable, чтобы потреблять его.

Вместо этого 

private http: HttpClient) {
    this.response =this.getCategory();
}

Попробуйте это 

private http: HttpClient) {
    this.getCategory().subscribe(result => this.responce = result);
}
0 голосов
/ 21 мая 2018

При использовании Observables вы должны подписаться на них.Фактический пользователь наблюдаемого должен подписаться (), потому что без подписки () наблюдаемое не будет выполнено вообще.

subscribe () возвращает подписку, на которую нельзя подписаться, но ее можно использовать для отмены подписки. 

 getCategory (): Observable<any> {
      return this.http.post(this.apiUrl,{}).subscribe(
         //Do whatever
        (res)=> console.log(res), 
        (error)=> console.log(error)
      );
    }

Для получения дополнительной информации см. Документацию Angular для Observables.: https://angular.io/guide/observables.

Кроме того, помните, что большинство подписок завершается само по себе, но всегда полезно завершать их, используя ngOnDestroy();, чтобы избежать утечек памяти.

Какиспользовать ngDestroy ()? В вашем файле component.ts Убедитесь, что у вас есть импорт 

import { Component, OnDestroy, OnInit } from '@angular/core';
export class YourComponent implements OnInit, OnDestroy {
 .
 .
 .
 ngOnDestroy() {
   this.response.unsubscribe();
  }
}

Теперь, относящийся к вашей проблеме CORS, обратитесь к вопросу, который был задан ранее в stackoverflow: Ответ на предполётный запрос не проходит проверку контроля доступа

0 голосов
/ 21 мая 2018

вы можете попробовать это решение 

 ngOnInit() {
   this.getCategory().subscribe(response => {
       console.log(response);
    }, err => {
       console.log(err);
    });
}
...