Angular 2 Http.Post nie wysyła żądania

Question

Próba zrobienia prostego testu POST na mój serwer, z pewnymi danymi i zwróceniem niektórych danych JSON. (Obecnie działa poprzez rozmowy, ale nic nie widzę na mojej karcie sieciowej że rzeczywiście próbował to zrobić?)

Moja serwisowa (api.service.ts)

import { Injectable } from '@angular/core'; 
 
import { Headers, Http, Response} from '@angular/http'; 
 
import {Observable} from 'rxjs/Rx'; 
 

 
// Import RxJs required methods 
 
import 'rxjs/add/operator/map'; 
 
import 'rxjs/add/operator/catch'; 
 

 
@Injectable() 
 
export class ApiService { 
 

 
\t private headers = new Headers({'Content-Type': 'application/json'}); 
 
    \t private myUrl = 'https://www.mywebsite.com'; // URL to web api 
 
    \t private payLoad = {"thingy1":"Value1", "thingy2":"value2"}; 
 

 
    \t constructor(private http:Http) { } 
 

 
    \t getData() { 
 
     this.http.post(this.myUrl, JSON.stringify(this.payLoad), this.headers) 
 
     \t .map((res:Response) => res.json()) 
 
      .catch((error:any) => Observable.throw(error.json().error || 'Server error')); 
 
    } 
 

 
}

Następnie po prostu mam metoda getData uruchomiona w komponencie nagłówka tylko po to, aby go uruchomić. (header.component.ts)

import { Component, OnInit } from '@angular/core'; 
 

 
//Service 
 
import { ApiService } from '../services/api.service'; 
 

 

 
@Component({ 
 
    selector: 'app-header', 
 
    templateUrl: './header.component.html', 
 
    styleUrls: ['./header.component.scss'] 
 
}) 
 

 
export class HeaderComponent implements OnInit { 
 

 
    constructor(private service:ApiService) { 
 
    this.service.getData(); //Fire getData from api.service 
 
    } 
 

 
    ngOnInit() { } 
 

 
}

Answer 1

Obserwowalne są leniwi, nawet jeśli je zainicjować, nie będą realizowane. Co najmniej jeden subskrybent musi jawnie subscribe do tego obserwowalne, aby słuchać tego strumienia. W skrócie: zostaną wykonane dopiero po zasubskrybowaniu.

this.service.getData().subscribe(
    (data) => console.log(data) 
); 

Answer 2

Upewnij się, że subskrybujesz swoje obserwowalne dane. Obserwator RxJS ma 2 części,

• next() - to przesyła dane, które są wykonywane przez kątowe.
• zasubskrybuj - potrzebujesz w swoim komponencie, aby dane były widoczne.

spróbować czegoś poniżej

this.service.getData().subscribe(
    (data) => { 
    //process your data here 
    } 
);