angular - Typ 'Observable<DocumentData[]>' kan inte tilldelas


Jag är ny på Angular och Firebase och jag försöker göra ett enkelt program med hjälp av exemplet från angular/fire-biblioteket:

import { Component } from '@angular/core';
import { Firestore, collectionData, collection } from '@angular/fire/firestore';
import { Observable } from 'rxjs';

interface Item {
  name: string
};

@Component({
  selector: 'app-root',
  template: `
  <ul>
    <li *ngFor="let item of item$ | async">
      {{ item.name }}
    </li>
  </ul>
  `
})
export class AppComponent {
  title = 'firetest2812';
  item$: Observable<Item[]>;
  constructor(firestore: Firestore) {
    const collect = collection(firestore, 'items');
    this.item$ = collectionData(collect);
  }
}

När jag kompilerade fick jag detta fel: "Fel: src/app/app.component.ts:24:5 - fel TS2322: Typen 'Observable' kan inte tilldelas typen 'Observable'."

Kan någon säga åt mig vad som är fel, snälla? Tack!

Svar #1

Jag löste detta genom att kasta på detta sätt:

 this.item$ = collectionData(collect) as Observable<Item[]>

Eller på ett bra sätt

Du kan använda AngularFirestore som firestore-typ istället för Firestore

Du kommer att få något liknande detta

import {Component} from '@angular/core';
import {Observable} from "rxjs";
import {AngularFirestore} from "@angular/fire/compat/firestore";


interface Item {
  name: string
}

@Component({
  selector: 'app-root',
  template: `
    <ul>
      <li *ngFor="let item of item$ | async">
        {{ item.name }}
      </li>
    </ul>
  `
})
export class AppComponent {
  title = 'firetest2812';
  item$: Observable<Item[]>;

  constructor(firestore: AngularFirestore) {
    this.item$ = firestore.collection<Item>("items").valueChanges();

  }
}

Svar #2

Du måste skicka din interface som typ till collection-funktionen.

 const collect = collection<Item>(firestore, 'items');

Relaterade artiklar