如何将界面模态转换为 Observable {}答案

【问题标题】：how to cast interface modal to Observable {}如何将界面模态转换为 Observable {}
【发布时间】：2023-03-13 22:22:01
【问题描述】：

API HTTP GET 请求从服务器返回以下响应

{
    "results": [
    {
        "id": "206152672",
        "title": "Test",
        "restrictions": {},
        "_expandable": {
            "container": "",
            "metadata": "",
            "extensions": "",
            "operations": "",
            "children": "",
            "history": "/rest/api/content/206152672/history",
            "ancestors": "",
            "body": "",
            "version": "",
            "descendants": "",
            "space": "/rest/api/space/Test"
        },
        "_links": {
            "webui": "/display/test",
            "tinyui": "/x/4KNJD"
        }
    },
    ...
    ...
   }]
}

在我的服务文件中，如果我在getNotes 函数上执行Observable<any>，我可以看到数据正在显示。

  getNotes(): Observable<any> {
    return this.http.get<any>(this.url);
  }

如果我尝试将响应强制转换为我的模式，则数据不会显示。当我订阅组件时，它返回undefined

export interface ReleaseModal {
    title:string,
    _links: {
        webui:string
    }
    id:number
}

getNotes(): Observable<ReleaseModal[]> {
    return this.http.get<any>(this.url);
}

请帮助我了解如何使用返回的 observable 投射我的模态。

注意：- 响应在对象中，而不是数组。

【问题讨论】：

您的回复与您的界面完全不符。当您的返回值不匹配时，我不确定您打算如何返回一个 ReleaseModal 类型的数组，而无需迭代结果并映射出您需要的值。
您的模型应该与您的响应完全相同，而不仅仅是您在 ReleaseModal 接口中定义的少数几个。如果您不确定对象是否包含 xyz 属性的任何属性，则可以将其定义为可选参数。像 xyz?: 字符串或任何可能的数据类型
查看您的 JSON：它是一个对象，具有名为 results 的唯一属性。这不是一个数组。
是的，它是一个对象，那么如何将模态转换为响应？我不需要所有的细节，只需几个
你不“投”。没有铸造之类的东西。要么返回 Observable，要么使用 map 或 pluck 运算符将实际 JSON 对象转换为 Array。

标签： angular

【解决方案1】：

来自服务器的对象结构与您所期望的（接口数组）不匹配。你得到的是一个对象{"results": ReleaseModal[]} 而不是一个数组。

因此您可以将 getNotes 方法的签名更改为

getNotes(): Observable<{"results": ReleaseModal[]}>

或者映射来自get的结果：

return this.http.get<any>(this.url).map(data => data.results);

当然是使用 rxjs 的 map 方法。

我认为应该没有问题，您的接口ReleaseModal 不包含响应数组中的所有属性，唯一的问题是响应不直接包含数组。

【讨论】：