Angular2：data.jsonは関数ではありません

Question

frontendとしてangle2を使用してアプリケーションを開発していますが、クライアント側からサーバー側にログインしたいのですが、クレデンシャルを渡そうとするとブラウザコンソールにこれらのエラーがあります。それはと不平を言う、実行時に

：

data.json is not a function

これは私のサービスコードである：ここで

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

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

import 'rxjs/add/operator/map'; 
import 'rxjs/add/operator/catch'; 

@Injectable() 
export class LoginService { 
isAuthenticated: boolean = true; 

    constructor(private http: Http) { 

    } 

    login(username: string, password: string) { 
    const headers = new Headers(); 

    const creds = 'username=' + username + '&password=' + password; 

    headers.append('Authorization', 'Basic ' + btoa(username + ':' + password)); 

    headers.append('Content-Type', 'application/x-www-form-urlencoded'); 

    return new Promise((resolve) => { 

     this.http.post('http://localhost:8080/StudentManager/login', creds, { headers: headers }) 

     .map(this.extractData) 

     .subscribe(
      (data) => { 
        if(data.json().success) { 
       window.localStorage.setItem('auth_key', data.json().token); 
       console.log(username); 
       this.isAuthenticated = true; 
        } 
       resolve(this.isAuthenticated); 
      }); 

    } 
    ); 
    } 

} 

は、エラーのスナップショットです：

Answer 1

data代わりのdata.json()、すでにextractData

.subscribe(
     (data) => { 
      if(data.success) { 
       window.localStorage.setItem('auth_key', data.token); 
       console.log(username); 
       this.isAuthenticated = true; 
      } 
      resolve(this.isAuthenticated); 
     }); 

Answer 2

あなたの問題あなたのデータには機能がありませんjson() ct。あなたがここに内側にある場合は、要求が成功したので、

.subscribe(
      (data) => {   
       window.localStorage.setItem('auth_key', data.json().token); 
       console.log(username); 
       this.isAuthenticated = true;      
       resolve(this.isAuthenticated); 
      }); 

への変更はまた、あなたはそれ以外の場合はエラーに行っただろう、あなたのデータメソッド内でそのチェックを実行する必要はありません。

Answer 3

を使用してJSONにデータをマッピングされたので、あなたはそれがエラーが消え、働いていたが、私はなぜ知らないこの

this.http.post('http://localhost:8080/StudentManager/login', creds, { headers: headers }) 
     .map(res => res.json()) 
     .subscribe(
      (data) => { 
        if(data.success) { 
          .... 
        } 
      }); 

    }