时间戳

首页 > 解决方案 > 为什么这适用于 HTTP 而不是 HTTPClient？

angular - 为什么这适用于 HTTP 而不是 HTTPClient？

问题描述

我是编程新手。所以，我有一个 API 服务，它的 get 方法可以像这样以 JSON 格式发送数据

{ "records" : [
        {
            "id" : "1",
            "name" : "aa"
        },
        {
            "id" : "2",
            "name" : "bb"
        },
        ...
    ]
}

我正在尝试使用角度 CLI 将数据获取到我的项目中。这是每个文件里面

//name.ts
export interface Name {
    id: number;
    name: string;
}

//name.service.ts
...
constructor(private _http: Http) { }

getName(): Observable<Name[]> {
    return this._http.get(this._url).pipe(map((res: Response) => res.json()));
}
...

//app.component.ts
...
names: Name[];

constructor(private _nameService: nameService) { }

ngOnInit() {
    this._nameService.getName().subscribe(data => this.names = data['records']);
}

这工作正常。但是，如果我使用 HttpClient 模块，并将getName()内部的功能更改name.service.ts为：

//name.service.ts after getName() change
...
constructor(private _http: HttpClient) { }

getName(): Observable<Name[]> {
    return this._http.get<Name[]>(this._url);
}
...

突然我得到了一个空列表。我做错了什么？我应该摆脱<Name[]>它return this._http.get(this._url);吗？但是，它会引发错误并且无法编译。

标签： angularangular-cli

解决方案

尝试这个

服务

getName(): Observable<Name[]> {
    return this._http.get(this._url).pipe(map((res: any) => res['records']));
}

零件

ngOnInit() {
    this._nameService.getName().subscribe(data => this.names = data);
}

推荐阅读