TS2559 has no properties in common with type

Изучаю Angular по учебному проекту с ютуба.

Есть интерфейс

export interface Product {
  type?: string
  id?: string
  title?: string
  date?: Date
}

сервис

export class ProductService {

  constructor(private http: HttpClient) { }

  create(product: any) {
    return this.http.post<FbResponse>(`${environment.fbDbUrl}/products.json`, product)
      .pipe(map( (res : FbResponse) => {
        return {
          ...product,
          id: res.name,
          date: new Date(product.date)
        }
      }))
  }

  getById(id: string) {
    return this.http.get(`${environment.fbDbUrl}/products/${id}.json`)
      .pipe( map ( (res: Product) => {
      // .pipe( map ( (res: {[index: string]: any}) => {
        return {
          ...res,
          id,
          date: res && res.date && new Date(res.date)
        }
      }))
  }
}

А разве здесь:

getById(id: string) {

не надо указать тип возвращаемого значения?

и компонент

product$?: Product;

  constructor(
    private productServ: ProductService,
    private route: ActivatedRoute
  ) { }

  ngOnInit(): void {
    this.product$ = this.route.params
      .pipe( switchMap( params => {
        return this.productServ.getById(params['id'])
      }))
  }

В этой строке

this.product$ = this.route.params

выдает ошибку:

TS2559: Type 'Observable{ id: string; date: Date | undefined; type?: string | undefined; title?: string | undefined; photo?: string | undefined; info?: string | undefined; price?: string | undefined; }>' has no properties in common with type 'Product'.

Я так понимаю, IDEA предлагает во всех полях прописать | undefined. Это будет правильно? Или можно как-то по другому исправить ошибку?

Ошибка уходит, если указываю такой тип:

product$?: any;

Но я не знаю на сколько это правильно.