角2のヘッダーとデータ

Question

角2では、JSON APIフィードからヘッダーとデータの両方を取得する基本的な例を誰にでも教えてください。データを取得する方法だけでなく、ヘッダーを取得するための例はたくさんあります。コンポーネントのコードとサービスのコードの両方を表示できますか？

Answer 1

まあ、ヘッダーは応答データ内にあるはずです。ほとんどの例では、JSONを受信して​​マップされたストリームにサブスクライブした直後にJSONをマップしています。 RxJS do演算子を使用すると、ストリームを代行受信して生の応答を処理できます。

import { Injectable } from '@angular/core'; 
import { Http } from '@angular/http'; 

@Injectable() 
export class UserService { 
    constructor(http:Http) { 
    this.people = http.get('https://jsonplaceholder.typicode.com/users') 
    .do((data) => { 
     console.log(data.headers); 
     // do your magic here 
    }) 
    .map(res => res.json()); 
    } 
} 

出力されるストリームの値ごとにデータを異なる方法で操作する場合は、データを読み取る前にマッピングを回避するのが最適です。

サービス：

import { Injectable } from '@angular/core'; 
import { Http } from '@angular/http'; 

@Injectable() 
export class UserService { 
    constructor(http:Http) { 

    } 

    getUsers() { 
    return this.http.get('https://jsonplaceholder.typicode.com/users'); 
    } 
} 

コンポーネント：

export class UserComponent implements OnInit { 

    users: any[]; 
    constructor(private userService: UserService) { } 

    getUsers(): void { 
    this.userService.getUsers().subscribe(result => { 
     let headers = result.headers; 
     this.users = result.json(); 
     // rest of the magic 
    }); 
    } 

    ngOnInit(): void { 
    this.getUsers(); 
    } 
} 

Answer 2

相続人は、ヘッダを設定するためのコードです！

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


@Injectable() 
export class AzureService { 
headers: Headers; 
constructor(private http: Http) { 
    this.headers = new Headers(); 
    this.headers.append('Content-Type', 'application/json'); 
    this.headers.append('ZUMO-API-VERSION', '2.0.0'); 

    } 
getUsers(){ 
http.get(<URL>,this.headers) 
    .do((data) => { 
    }) 
    .map(res => res.json()); 
} 

APIからヘッダーを取得するには、@Adnan A. answer！を参照してください。