I have below code in an Angular application which is using AngularFire2.
TypeScript:
constructor(db: AngularFirestore) {
this.booksCollectionRef = db.collection<Book>('books');
this.books = this.booksCollectionRef.snapshotChanges().map(actions => {
return actions.map(action => {
const data = action.payload.doc.data() as Book;
const id = action.payload.doc.id;
return { id, ...data };
});
});
}
HTML:
<md-list>
<md-list-item *ngFor="let book of books | async">
<h4 md-line>{{book.name}}</h4>
</md-list-item>
</md-list>
This code retrieves and binds data as expected (removes items when collection updated), now I want to sort the collection by a given column. I tried to use firebase orderBy clause, but I can not figure out how to use it with snapShotChanges()
method.
The following should work for your use case:
this.booksCollectionRef = db.collection<Book>('books', ref => ref.orderBy('order field'));
Take a look at the documentation of AngularFirestore for further information on this topic.
this.announcementCollectionRef = afs.collection<Announcement>('announcements', ref => ref.orderBy('createdAt', 'desc')); this.announcements = this.announcementCollectionRef.snapshotChanges().map(actions => { return actions.map(a => { const data = a.payload.doc.data() as AnnouncementId; const id = a.payload.doc.id; return { id, ...data }; }); });
Not sure about Angular Fire, but you can try using the Firebase Firestore libraries directly.
The following code works for me:
someCollectionRef
.orderBy('columnName')
.onSnapshot((snapshot) => {
snapshot.docChanges.forEach(function (change) {
...doStuff
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.