[解決済み] タイプスクリプト タイプ X はタイプ Y の length、pop、push、concat、その他 26 のプロパティが欠落しています。[2740]

質問

このような製品インタフェースがあります。

export interface Product{
  code: string;
  description: string;
  type: string;
}

プロダクトエンドポイントを呼び出すメソッドを持つサービス。

  public getProducts(): Observable<Product> {
    return this.http.get<Product>(`api/products/v1/`);
  }
  

そして、このサービスを使って商品を取得するコンポーネントです。

export class ShopComponent implements OnInit {
    public productsArray: Product[];
    
    ngOnInit() {
        this.productService.getProducts().subscribe(res => {
          this.productsArray = res;
        });
    }
}

この状態で、エラーが発生しました。

[ts] タイプ 'Product' には、タイプから以下のプロパティが欠落しています。 'Product[]': length, pop, push, concat, and 26 more. [2740]

のタイピングを削除する productsArray 変数の型付けを削除するとエラーはなくなりますが、なぜこれが動作しないのかがわかりません。 Products ?

どのように解決するのですか？

以下のように Observable<Product> であることを期待し Product[] 内部 subscribe コールバックの中にあります。

から返されるTypeは http.get() と getProducts() は Observable<Product[]>

public getProducts(): Observable<Product[]> {
    return this.http.get<Product[]>(`api/products/v1/`);
}