Angular2を試しているAPIから返されたJSONを読み取ることができません

Question

API呼び出しから返されたJSONを読み取ることができません。 ここに私のサービスファイルがあります。ここから呼び出され

import { Injectable } from '@angular/core'; 
import { URLSearchParams, Jsonp, Http } from '@angular/http'; 
import 'rxjs/add/operator/toPromise'; 
import 'rxjs/add/operator/map'; 

@Injectable() 
export class BaseballService { 

    constructor(private jsonp: Jsonp) {} 

    search() { 

    return this.jsonp.request('http://api.sportradar.us/mlb-t6/players/6e1cac5c-b059-4b80-a267-5143b19efb27/profile.json?api_key=[hidden]') 
       .subscribe((data) => { 
       (data) 
    })} 
} 

：

import { Component } from '@angular/core'; 
import { BaseballService } from './baseball.service' 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'], 
    providers: [BaseballService] 
}) 
export class AppComponent { 
    title = 'Baseball App'; 

    constructor(private _baseballService: BaseballService) { 

    } 

    ngOnInit(){ 
    let zx = this._baseballService.search(); 
    console.log(zx); 
    } 
} 

私は、JSONデータを読み取ることができないと、このエラーを取得しています：JSONPコールバックを呼び出していなかったスクリプトを注入しました。 私はHTTPリクエストを試しましたが、どこにも行きませんでした。 http://plnkr.co/edit/8ap1Lm?p=preview

Answer 1

私は角度でJSONPを使用していないHTTPオブジェクト

import { Injectable } from '@angular/core'; 
import { URLSearchParams, Jsonp, Http, Headers } from '@angular/http'; 
import 'rxjs/add/operator/toPromise'; 
import 'rxjs/add/operator/map'; 

@Injectable() 
export class BaseballService { 

headers: Headers; 

constructor(private http: Http) { 
    this.headers = new Headers(); 
    this.headers.append('content-type', 'application/json');  
} 

search() { 

return this.http.get('http://api.sportradar.us/mlb-t6/players/6e1cac5c-b059-4b80-a267-5143b19efb27/profile.json?api_key=[hidden]',this.headers).map(resp => resp.json()) 
} 

および成分中

import { Component, OnInit } from '@angular/core'; 
import { BaseballService } from './baseball.service' 

@Component({ 
selector: 'app-root', 
templateUrl: './app.component.html', 
styleUrls: ['./app.component.css'], 
providers: [BaseballService] 
}) 
export class AppComponent implements OnInit { 
title = 'Baseball App'; 
zx: any; 

constructor(private baseballService: BaseballService) { 
} 

ngOnInit(){ 
    this.baseballService.search().subscribe((data) => { 
    this.zx = data; 
    console.log(this.zx); 
    }); 

} }