我正在尝试制作一个同时包含前端和后端的应用程序。我已经完成了这两个程序，但是现在我在尝试连接它们时遇到了一些麻烦。我不断收到以下错误：
目录.组件.ts：45错误错误：NG0900：尝试对“[object Object]”进行差异比较时出错。DefaultIterableDiffer.diff（core.mjs：28514：19）中只允许数组和可迭代对象
首先，我尝试获取数组“response”，即产品所在的位置：
PRODUCT.SERVICE.TS

public getAll(): Observable<Product[]> {
    return this.http.get<Response["response"]>(this.productsUrl);
  }

此方法接收以下响应：

{
    "httpCode": 200,
    "message": "OK",
    "response": [
        {
            "pieceName": "Mini Figure Trophy",
            "pieceImageURL": "https://www.lego.com/cdn/product-assets/element.img.lod5photo.192x192/6335932.jpg",
            "piecePrice": 0.3,
            "pieceTag": "Bestseller",
        },
        {
            "pieceName": "Animal No. 17 Dog",
            "pieceImageURL": "https://www.lego.com/cdn/product-assets/element.img.lod5photo.192x192/6076467.jpg",
            "piecePrice": 2.76,
            "pieceTag": "Bestseller",
        }
    ]
}

然后，当目录页打开时，我运行以下两个函数：
CATALOG.COMPONENT.TS

ngOnInit(): void {
    this.getProducts();
    
    this.searchSubject.subscribe(value => this.searchService.setSearchValue(value));

    this.searchService.searchValue$.subscribe(value => {
      this.productService.getProductByNameLike(value).subscribe(productsCalled => {
        this.products = productsCalled})
    })
  }

  getProducts(): void {
    this.productService.getAll().subscribe({ <- Line where the error occurs
      next: (productsCalled: Product[]) => {
        this.products = productsCalled
        this.checkProductsOnCart()
      },
      error: (err) => console.log(err),
      complete: () => console.log("completo")
    });
  }

但是我一直得到NG0900错误，我相信这可能是因为我没有阅读产品所在的数组。
我已经更改了getAll方法，与原来一样：

public getAll(): Observable<Product[]> {
    return this.http.get<Product[]>(this.productsUrl);
  }

我也试着在这里搜索其他答案，但似乎没有一个适合我的问题，或者也许我只是一个新手太多，看到的关系。有人知道我做错了什么吗？提前感谢。