Angular GET 请求返回对象而不是对象数组

Question

我的 GET 请求将来自我的 API 的数据作为对象内的对象返回，而不是对象数组。这使我无法打印数据，因为您需要一个可迭代对象。

我真的不明白为什么这个特定请求的输出不同，因为我还有其他 GET 请求可以正常工作。

组件

this.apiService.getList(this.listId).subscribe((results: any) => {
      this.recipes = results
      console.log(results)
    })

服务

getList(listId) {
    return this.http.get(`https://secure-fortress-48055.herokuapp.com/api/v1/lists/${listId}`).pipe(
      map((res: any) => res)
    )
  }

输出看起来像这样

我认为映射现在什么都不做，因为响应没有设置任何类型，所以我的 API 可能有问题？

数据是从我的 Laravel API 中获取的，它使用了一个资源

  public function toArray($request)
    {
        return [
            'id' => (string)$this->id,
            'type' => 'Recipes',
            'attributes' => [
                'name' => $this->name,
                'meal_id' => $this->meal_id,
                'list_id' => $this->list_id,
                'created_at' => $this->created_at,
                'updated_at' => $this->updated_at,
            ]
        ];
    }

知道是什么问题吗？

Answer 1

在 Angular 代码中，您可以将键值对映射到值数组。

Object.values(res)

所以，服务代码的管道部分将是：

pipe(map((res: any) => Object.values(res)))

这将返回一个包含该键值对集合的值的数组。

注意：这是一个特定于 Angular 的解决方案。