是否可以反转 Firebase 列表? [英] Is it possible to reverse a Firebase list?

问题描述

我已经阅读了关于 SO 的所有问题，但我仍然没有找到答案.所以不要将其标记为重复.

我将 AngularFire 与 Angular 2 和 Typescript 一起使用.我正在使用 FirebaseListObservable 从端点提取 24 条最新记录的列表.这是我的代码:

import { Component } from '@angular/core';从 'angularfire2' 导入 { AngularFire, FirebaseListObservable };@成分({选择器:'故事列表'，templateUrl: './story-list.component.html',styleUrls: ['./story-list.component.scss']})导出类 StoryListComponent {故事:FirebaseListObservable;构造函数(AF:AngularFire){this.stories = af.database.list('/stories', {询问: {限制到最后:24}});}}

这会返回 24 个最新故事的列表，正如预期的那样，但是当我在页面上呈现它们时:

<p *ngFor="let story of stories | async">{{ story.title }}</p>

它在顶部显示最旧的故事，在底部显示最新的故事.我明白为什么会这样，我并不是说这是一个问题，但是我如何扭转这种情况?我希望能够在查询中反转它，但如果这不可能，我愿意在渲染中以某种方式反转它.

无论您的答案是什么，请不要只链接到文档.AngularFire 没有完整解释这一点的文档.我读过每一个字.请提供真实的工作代码.

然而，我绝对不会接受的一个解决方案是在创建时在记录中存储一个负日期，然后根据它进行排序.这是我听过的最糟糕的解决方案，真正的数据库系统将允许您在查询中执行此操作.所以请不要推荐它.

如果您有任何想法，我将不胜感激.我不想使用其他产品，因为我喜欢 Firebase.

解决方案

据我所知，Firebase 查询总是按升序排列.

但是，您可以使用 map 运算符来反转呈现列表的顺序，以反转 AngularFire2 observable 发出的数组:

import "rxjs/add/operator/map";...this.stories = af.database.list('/stories', {询问: {限制到最后:24}}).map((array) => array.reverse()) 作为 FirebaseListObservable;

如果您更喜欢在模板中执行此操作，可以查看此答案.>

I've read every question on SO about this and I still haven't found an answer to this. So don't mark this as a duplicate.

I'm using AngularFire with Angular 2 and Typescript. I'm using FirebaseListObservable to pull a list of the 24 most recent records from an endpoint. Here's my code:

import { Component } from '@angular/core';
import { AngularFire, FirebaseListObservable } from 'angularfire2';

@Component({
  selector: 'story-list',
  templateUrl: './story-list.component.html',
  styleUrls: ['./story-list.component.scss']
})
export class StoryListComponent {
  stories: FirebaseListObservable<any[]>;

  constructor(af: AngularFire) {
    this.stories = af.database.list('/stories', {
      query: {
        limitToLast: 24
      }
    });
  }
}

This returns a list of the 24 latest stories, as expected, but when I render them on the page with:

<p *ngFor="let story of stories | async">{{ story.title }}</p>

It shows the oldest story on the top, and the newest on the bottom. I understand why this is, and I'm not claiming it's an issue, but how would I reverse this? I'd like to be able to reverse this in the query, but if that's not possible, I'd be open to somehow reversing it in the rendering.

Whatever your answer is, please don't just link to documentation. There is no documentation for AngularFire that fully explains this. I've read every word. Please provide real working code.

One solution that I absolutely will not accept, however, is storing a negative date in the records at the time of creation and then sorting based on that. That is the worst solution I've ever heard, and a real database system would allow you to do this in the query. So please don't even suggest it.

If you have any ideas, I would greatly appreciate it. I would hate to have to use another product because I love Firebase.

解决方案

As far as I'm aware, the Firebase queries are always in ascending order.

However, you can reverse the ordering of the rendered list using the map operator to reverse the array that's emitted by the AngularFire2 observable:

import "rxjs/add/operator/map";

...

this.stories = af.database.list('/stories', {
  query: {
    limitToLast: 24
  }
}).map((array) => array.reverse()) as FirebaseListObservable<any[]>;

If you'd prefer to do it in the template, you could have a look at this answer.

这篇关于是否可以反转 Firebase 列表?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！