將數組類型初始化為 object javascript

Question

我有一個名為 Products 的界面

 export interface Products{
    category: string;
    imageUrl: string;
    price: number;
    title: string;
 }

我的產品數組類型的組件中有一個變量

products: Products[];

我正在嘗試 map 我的服務對產品變量的響應，但我收到此錯誤類型

'{}[]' is not assignable to type 'Products[]'

我不知道我做錯了什么

this.subscription = this.productService
  .getAll()
  .subscribe(
    products =>
      (this.products = products.map(p => ({ ...(p.payload.val() as {}) }))),
  )

Answer 1

在這個賦值子句中：

this.products = products.map(p => ({
  ...(p.payload.val() as {})
}))

...您將p.payload.val()轉換為類型{}並將其傳播到一個空的 object （克隆它？），它仍然保持其類型為{} 。 因此， products.map(...)的類型是{}[] ，也就是Array<{}> 。 由於this.products是Product[] ，因此類型不兼容。

如果p.payload.val()已經是Product類型，則無需轉換任何內容：

this.products = products.map(p => p.payload.val())

// or if you need that cloning stuff...

this.products = products.map(p => ({ ...p.payload.val() }))

如果它不是Product類型，則轉換為Product而不是{} ：

this.products = products.map(p => p.payload.val() as Product)

// or if cloning...

this.products = products.map(p => {
  return { ...p.payload.val() } as Product
});