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 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');
