absteigend orderByChild() auf Feuerbasis und Ionic 2

Question

ich brauche Artikel nach Datum sortiert, aber offensichtlich muss absteigend ich die Beiträge in der richtigen Reihenfolge ...

import { 
 
    AngularFireDatabase 
 
} from 'angularfire2/database'; 
 
import 'rxjs/add/operator/map'; 
 

 
/* 
 
    Generated class for the FirebaseProvider provider. 
 

 
    See https://angular.io/docs/ts/latest/guide/dependency-injection.html 
 
    for more info on providers and Angular 2 DI. 
 
*/ 
 
@Injectable() 
 
export class FirebaseProvider { 
 

 
    constructor(public afd: AngularFireDatabase) {} 
 

 

 
    getPostsItems() { 
 
    return this.afd.list('/Posts/', { 
 
     query: { 
 
     orderByChild: "date", 
 
     } 
 
    }); 
 

 
    }

Diese zeigen sortiert Abfrage gibt eine Ascendent-Reihenfolge zurück und ich benötige eine untergeordnete Reihenfolge, die in Firebase Web nicht erläutert wird.

Welche Fragen brauche ich?

Answer 1

Eine Möglichkeit könnte darin bestehen, die Reihenfolge in der Vorlage Ihrer Komponente umzukehren. Erstens gibt es eine Liste der Beiträge direkt in Ihrer Komponente erhalten:

posts.component.ts

export class PostsComponent { 
    posts: FirebaseListObservable<any>; 

    constructor(db: AngularFireDatabase) { 
    this.posts = db.list('/posts', { 
     query: { 
     orderByChild: 'date' 
     } 
    }); 
    } 
} 

Dann können Sie die reverse Methode verwenden, um Ihre Beiträge bestellen in Ihrer Vorlage zu umkehren:

posts.component.html

<div *ngFor="let post of (posts | async)?.slice().reverse()"> 
    <h1>{{ post.title }}</h1> 
</div> 

Answer 2

Wor König ohne async in den ngFor

posts.component.ts

export class PostsComponent { 
posts: FirebaseListObservable<any>; 

constructor(db: AngularFireDatabase) { 
this.posts = db.list('/posts', { 
    query: { 
    orderByChild: 'date' 
    } 
}); 
} 
} 

Dann können Sie die Reverse-Methode verwenden, Ihre Beiträge zu bestellen in der Vorlage umzukehren:

Beiträge component.html

<div *ngFor="let post of posts?.slice().reverse()"> 
<h1>{{ post.title }}</h1> 
</div>