Инициализация типа массива для объекта javascript

Question

У меня есть интерфейс с названием Products

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

У меня есть переменная в моем компоненте массива типов продуктов

products: Products[];

Я пытаюсь отобразить свой ответ от моего сервиса на Переменная products, но я получаю эту ошибку Введите

'{}[]' 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() как тип {}, а также распространяете это в пустой объект (чтобы его клонировать?), Который все еще сохраняет его тип как {}. Следовательно, 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
});