在Angular中,可以使用AngularFirestore集合快照来监听Firestore集合的更改。以下是一个包含代码示例的解决方法:
首先,确保已经安装并导入了AngularFirestore模块:
import { AngularFirestore, AngularFirestoreCollection } from '@angular/fire/firestore';
import { Observable } from 'rxjs';
然后,创建一个集合引用和一个Observable对象来监听集合的快照更改:
export class YourComponent {
private collectionRef: AngularFirestoreCollection;
items: Observable;
constructor(private firestore: AngularFirestore) {
this.collectionRef = this.firestore.collection('your-collection');
this.items = this.collectionRef.valueChanges({ idField: 'id' });
}
}
在上面的代码中,your-collection
是你要监听的Firestore集合的名称。
最后,在你的模板中使用async
管道来订阅Observable并显示集合中的数据:
-
{{ item.id }} - {{ item.name }}
这将自动更新模板中的数据,以反映Firestore集合的任何更改。
请注意,上面的代码只是一个示例,你可以根据自己的需求进行修改和扩展。