Angular 中 API 的空响应

Null response from API in Angular

学习 Angular 2 并使用 .Net Core 构建应用程序
我有一个 API,json 响应从中传递到客户端。在我的 Angular2 服务中,使用 Observable 读取响应并将其传递给我的 component,然后传递给 view.
PostMan 中测试,我的 API 正在响应预期的输出。我确定该服务存在一些需要时间解决的问题。

API :

[HttpGet]
    public List<MovieFields> Get()
    {
        path += @"\Data\MovieSource.json";
        string jsonSource = System.IO.File.ReadAllText(path);
        List<MovieFields> source = JsonConvert.DeserializeObject<List<MovieFields>>(jsonSource);
        return source;
    }

Json c# class :

public class MovieFields
{
    public string Id { get; set; }
    public string Title { get; set; }
}

服务:

export class MoviesService{

constructor(private http: Http) {
}

getMovies() {
    return this.http.get('api/Movies')
        .map(res => <Array<MovieProperties>>res.json());
}

}

组件:

export class AllMoviesComponent implements OnInit {

private movieProp: Array<MovieProperties>;
ngOnInit() {
    this.moviesService.getMovies()
        .subscribe(ban => this.movieProp = ban);
}

Angular Json 界面:

export interface MovieProperties {    
Id: string;
Title: string;

}

最后是我的 JSON:

 [
{
  "Id": "1",
  "Title": "Olympus Has Fallen"
},
{
  "Id": "2",
  "Title": "Man of Steel"
}  ]

答案:编辑我的 service 如下

getMovies(): Observable<MovieProperties[]> {

    return this.http.get('api/Movies')
        .map(this.extractData)
        .catch(this.handleErrors);
}
private extractData(res: Response) {
    let data = res.json();
    return data;
}

感谢Sajeetharan

你的服务里面的方法应该是这样的,

getMovies() : Observable<MovieProperties[]>{
    return this._http.get('api/Movies')
        .map((response: Response) => <MovieProperties[]>response.json())
        .catch(this.handleError);
}

private handleError(error: Response){
    console.error(error);
    return Observable.throw(error.json().error || 'Server error');
}
export interface MovieProperties {    
id: string;
title: string;
}

像这样改变大小写对我有用。