angularfire
angularfire copied to clipboard
Update README.md
Variable con ámbito de bloque 'collection' usada antes de su declaración.ts(2448)
El tipo 'Observable<DocumentData[]>' no se puede asignar al tipo 'Observable<Item[]>'. El tipo 'DocumentData[]' no se puede asignar al tipo 'Item[]'. La propiedad "name" falta en el tipo "DocumentData", pero es obligatoria en el tipo "Item".ts(2322)
El método collection tiene el mismo nombre de la constante de manera que el compilador confunde ambos.
Checklist
- Issue number for this PR: #nnn (required)
- Docs included?: (yes/no; required for all API/functional changes)
- Test units included?: (yes/no; required)
- In a clean directory,
yarn install,yarn testrun successfully? (yes/no; required)
Description
Code sample
I also got those two errors. In the page https://github.com/angular/angularfire under "Example use," this code
const collection = collection(firestore, 'items');
this.item$ = collectionData(collection);
throws this error
'collection' implicitly has type 'any' because it does not have a type annotation and is referenced directly or indirectly in its own initializer.
I fixed it by changing the constant collection to myCollection:
const myCollection = collection(firestore, 'items');
this.item$ = collectionData(myCollection);
The second error is in this code:
interface Item {
name: string,
};
The error is:
Type 'Observable<DocumentData[]>' is not assignable to type 'Observable<Item[]>'.
Type 'DocumentData[]' is not assignable to type 'Item[]'.
Property 'name' is missing in type 'DocumentData' but required in type 'Item'.
This is easily fixed by making name optional:
interface Item {
name?: string,
};
Here's the complete working code:
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',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'GreatestComputerScientists-7.4';
item$: Observable<Item[]>;
constructor(firestore: Firestore) {
const myCollection = collection(firestore, 'items');
this.item$ = collectionData(myCollection);
}
}
I put the HTML section into app.component.html.