CODEWITHSUNDEEP
angularfirebasefirebase-realtime-databaseangularfire
parvaneh
parvaneh

Reputation: 99

AngularFireList change retrieving Order

I want to get some Data from my Firebase DB, I am listing them with ngfor async, but there are always the most recent at the bottom, but I want them at the Top.

This is my Constructor for the Page:

  uid = this.afAuth.auth.currentUser.uid;
  answersRef: AngularFireList<any>;
  allMyAnswers: Observable<any[]>;


  constructor(private afAuth: AngularFireAuth,
    private db: AngularFireDatabase, public authService: AuthService, private router: Router) { 

      var path = 'users/' + this.uid + '/answers';

      this.answersRef = db.list(path);
      this.allMyAnswers = this.answersRef.snapshotChanges().map(changes => {
          return changes.map(c => ({ key: c.payload.key, ...c.payload.val() }));
     });


  }

And I am listing them by that:

 <div class="aanswer" *ngFor="let myAnswers of allMyAnswers | async">

I am googling now since some time but couln'd find a solution that works for snapshotChanges and AngularFireList.

Upvotes: 0

Views: 248

Answers (1)

Rach Chen
Rach Chen

Reputation: 1382

Set the reverse pipe would hit the goal.

pipe.ts

import {Pipe} from 'angular/core';

@Pipe({
  name: 'reverse',
  pure: false
})
export class ReversePipe {
  transform (v) {
    if (v) return v.reverse();

  }
}

your.html

 <div class="answer" *ngFor="let myAnswers of allMyAnswers | async | reverse">

And your class got wrong name.

Upvotes: 2

Related Questions