Angular 2 http no obtiene

Soy nuevo en Angular 2 y todavía estoy aprendiendo. Estoy intentando acceder a una URL con una llamada de obtención, pero la obtención no parece realizarse ni siquiera en la red del navegador. No puedo encontrar la URL de obtención que se está llamando.

El programa irá a la consola de ese método registrando arriba y abajo de esa llamada de obtención, pero nada para la llamada de obtención.

Mi método de servicio

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");
}

Importado HttpModuleen app.module.ts

Mi consola Captura de pantalla

Consola]

Dec 29 '16 20:12

Http usa rxjs y es un observable frío/perezoso, lo que significa que debes suscribirte para que funcione.

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

O si desea suscribirse desde otro lugar, debe devolver el http.getmétodo como este:

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();
    });
}

y luego :

getAllPersons().subscribe();

Dec 29 '2016 14:12 Milad

Como lo mencionó Milad en su respuesta , dado que Observablelos mensajes devueltos por los métodos de Http son fríos/perezosos y no se activarán hasta que subscribelos acceda.

Pero digamos, ¿qué sucede si no desea .subscribepero Observableaún desea que se active la solicitud HTTP?

En caso de que estés usando Angular 6 con Rxjs6 y no quierassubscribe , puedes hacer lo siguiente:

...
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();
}

Aquí hay un StackBlitz de muestra para su árbitro.

Oct 14 '2018 13:10 SiddAjmera

El método debe devolver la respuesta de la llamada a la API utilizando Observable.

servicio.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');
  }
}

Las opciones y los encabezados son opcionales.

Nota: en lugar de ( <any>) puedes definir tu tipo de datos o cualquier otro tipo definido en el que obtengas datos en tu respuesta.

Gracias.

Dec 29 '2016 14:12 Amol Bhor