web-dev-qa-db-de.com

Winkel 2 http bekommen nicht bekommen

Ich lerne gerade, dass Angular 2 immer noch lerne. Ich versuche, eine URL mit einem get-Aufruf zu treffen, aber der get scheint nicht einmal im Browser-Netzwerk durchzugehen. Ich kann nicht feststellen, dass die get-URL aufgerufen wird.

Das Programm geht zu dieser Methodenkonsolenprotokollierung über und unter dem get-Aufruf, aber nichts für den get-Aufruf

Meine Servicemethode

import { Headers, Http, Response } from '@angular/http';
import { Injectable } from '@angular/core';
import { Persons } from './mock-people';
import { Person } from './person';
import {Observable} from 'rxjs/Rx';

getAllPersons(): void {
  console.log("Here");
  this.http.get(`http://swapi.co/api/people/1`)
    .map((response: Response) => {
      console.log(response.json());
      response.json();
    });
  console.log("Comes here 2");
}

HttpModule in app.module.ts importiert 

Meine Konsole Screenshot

Console]

36
user7161814

Http verwendet rxjs und ist ein kalt/faul beobachtbar, was bedeutet, dass Sie es abonnieren sollten, damit es funktioniert. 

this.http.get(`http://swapi.co/api/people/1`)
  .map((response: Response) => {
    console.log(response.json());
    response.json();
  })
  .subscribe();

Oder wenn Sie von woanders abonnieren möchten, sollten Sie die http.get-Methode folgendermaßen zurückgeben: 

getAllPersons(): Observable <any> {
  console.log("Here");
  return this.http.get(`http://swapi.co/api/people/1`)
    .map((response: Response) => {
      console.log(response.json());
      return response.json();
    });
}

und dann : 

getAllPersons().subscribe();
78
Milad

die Methode sollte die Antwort eines API-Aufrufs mit Observable zurückgeben.

service.cs

import { Http, Jsonp, Response, Headers, RequestOptions } from '@angular/http';
import { Injectable } from '@angular/core';
import { Persons } from './mock-people';
import { Person } from './person';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/forkJoin';

@Injectable()
export class Service {
  constructor(private jsonp: Jsonp, private _http: Http) { }

  getAllPersons():Observable<any>{
    console.log("Here");

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

    return this._http.get('http://swapi.co/api/people/' + personId)
        .map((res:Response) => {
            return <any>res.json();
        })
        .catch(this.handleError);          

    console.log("Comes here 2");
  }

  private handleError(error: Response) {
    console.error(error);
    return Observable.throw(error.json().error || ' error');
  }
}

optionen und Header sind optional.

Hinweis: Anstelle von (<any>) können Sie Ihren Datentyp oder einen anderen definierten Typ definieren, in dem Sie Daten in Ihrer Antwort erhalten.

Danke dir.

1
Amol Bhor

Wie von Milad in seiner answer erwähnt, sind Observables, die von den Http-Methoden zurückgegeben werden, kalt/faul und werden erst ausgelöst, wenn Sie subscribe für sie sind.

Aber lassen Sie uns sagen, was passiert, wenn Sie .subscribe nicht zur Observable __codieren möchten, aber trotzdem die HTTP-Anfrage auslösen möchten?

Falls Sie Angular 6 mit Rxjs6 verwenden und subscribe nicht verwenden möchten, können Sie Folgendes tun:

...
import { publish } from 'rxjs/operators';
import { HttpClient } from '@angular/common/http';

constructor(private http: HttpClient) {}

getAllPersons() {
  const getAllPersons$ = this.http.get(`https://swapi.co/api/people/1`)
    .pipe(
        publish()
      );

  getAllPersons$.connect();
}

Hier ist ein Sample StackBlitz für Ihren Hinweis.

0
SiddAjmera