Dado que el método de post de la clase Http devuelve un observable, debe suscribirse para ejecutar su procesamiento de inicialización. Los observables son perezosos.

Deberías echar un vistazo a este video para más detalles:

• https://egghead.io/lessons/rxjs-rxjs-observables-vs-promises

Debe suscribirse al observable devuelto si desea que se ejecute la llamada.

Consulte también la siguiente documentación angular " Comunicación con servicios de back-end mediante HTTP ".

¡ Suscríbete siempre!

Un método HttpClient no comienza su solicitud HTTP hasta que llamas subscribe() en el observable devuelto por ese método. Esto es cierto para todos los métodos HttpClient .

AsyncPipe se suscribe (y cancela la suscripción) automáticamente.

Todos los observables devueltos por los métodos HttpClient son fríos por diseño. La ejecución de la solicitud HTTP se aplaza , lo que le permite extender lo observable con operaciones adicionales como tap y catchError antes de que ocurra algo.

Llamar subscribe(...) activa la ejecución del observable y hace que HttpClient componga y envíe la solicitud HTTP al servidor.

Puede pensar en estos observables como planos para solicitudes HTTP reales.

De hecho, cada subscribe() inicia una ejecución separada e independiente del observable. Suscribirse dos veces da como resultado dos solicitudes HTTP.

 const req = http.get<Heroes>('/api/heroes'); // 0 requests made - .subscribe() not called. req.subscribe(); // 1 request made. req.subscribe(); // 2 requests made.

El método de obtención no requiere el uso del método de suscripción, pero el método de publicación requiere la suscripción. Obtenga y publique códigos de muestra a continuación.

 import { Component, OnInit } from '@angular/core' import { Http, RequestOptions, Headers } from '@angular/http' import 'rxjs/add/operator/map' import 'rxjs/add/operator/catch' import { Post } from './model/post' import { Observable } from "rxjs/Observable"; @Component({ templateUrl: './test.html', selector: 'test' }) export class NgFor implements OnInit { posts: Observable<Post[]> model: Post = new Post() /** * */ constructor(private http: Http) { } ngOnInit(){ this.list() } private list(){ this.posts = this.http.get("http://localhost:3000/posts").map((val, i) => <Post[]>val.json()) } public addNewRecord(){ let bodyString = JSON.stringify(this.model); // Stringify payload let headers = new Headers({ 'Content-Type': 'application/json' }); // ... Set content type to JSON let options = new RequestOptions({ headers: headers }); // Create a request option this.http.post("http://localhost:3000/posts", this.model, options) // ...using post request .map(res => res.json()) // ...and calling .json() on the response to return data .catch((error:any) => Observable.throw(error.json().error || 'Server error')) //...errors if .subscribe(); } }