Question

上下文

Angular 8应用程序请求外部Web API。

GET 请求结果如下：

{
"data": [
    {
        "name": "QWERTY",
        "isValid": false
    }]
}

我在服务中使用此TypeScript代码调用api：

private categoryUrl = 'http://localhost:8081/api/categories?OrderBy=';

return this.http.get<ICategory[]>(this.categoryUrl + prop )
    .pipe(
        tap(data => console.log(JSON.stringify(data)))
        ,map(item=>item.data)
);
}

我的问题

这行代码无法编译声明：

错误TS2339：类型“ ICategory []”上不存在属性“数据”

如果我注释 map（）行并运行它进行编译，则Web应用程序将启动，但是html模板上没有显示数据。

如果然后我取消注释而不停止，则应用程序重新编译，发送相同的错误消息。但是请求正确完成，我可以在模板上看到结果。

我的问题

我该如何解释？
做这项工作的正确方法是什么？

谢谢

Answer 1

您可能只是收到类型检查错误。类ICategory的属性是什么？

执行this.http.get<ICategory[]>时，HTTP响应应遵循ICategory的接口。检查data是否是ICategory中的属性，并进行相应的修改。

如果ICategory应该是数组'data'中的实际数据。您可以忽略通用类型，也可以使用正确的接口：this.http.get<{ data: ICategory[]}>

Answer 2

查看您收到的JSON。它以{开头。因此，它不是数组。这是一个对象。

但是请看一下您的代码：

this.http.get<ICategory[]>

这告诉TypeScript：相信我，响应主体是ICategory对象的数组。

因此，您需要将正确通用类型传递给http.get()。您尚未了解如何定义ICategory，所以我不知道这种类型应该是什么（除了当然是根据JSON自己定义）。

无法从Angular的GET请求中获取数据

2 个答案: