要在html上显示的Angular4 Firebase FirebaseListObservable控件索引

我想在我的应用程序中创建一个排行榜。所以我需要从Firebase数据库中读取名称和totalscores信息，并在浏览器上显示它们。 我的目标是在浏览器上显示类似的内容，当然，用数据库用户名和TopCore替换未知内容

排行榜 第一：未知，上核：未知 第二：未知，上核：未知 第三：未知，上核：未知 第四：未知，上核：未知 第五：未知，核心：未知

我的firebase数据库是：

"users" : {
    "Test1" : {
      "totalscore" : 50,
      "username" : "test1"
    },
    "Test2" : {
      "totalscore" : 30,
      "username" : "test2"
    },
    "Test3" : {
      "totalscore" : 20,
      "username" : "test1"
    },
    "Test4" : {
      "totalscore" : 10,
      "username" : "test1"
    },
    "Test5" : {
      "totalscore" : 50,
      "username" : "test1"
    },
    "Test6" : {
      "totalscore" : 30,
      "username" : "test2"
    },
    "Test7" : {
      "totalscore" : 20,
      "username" : "test1"
    },
    "Test8" : {
      "totalscore" : 10,
      "username" : "test1"
    }
  }

通过下面的代码，我可以得到我想要的反向信息

topusers: FirebaseListObservable<any>;
  constructor(db: AngularFireDatabase) {


        this.topusers = db.list('users', {
        query: {
         orderByChild: "totalscore",
         limitToLast: 10,
        }
        });
   } 

最后使用*ngFor我可以显示从第五个到第一个的5个上核

<ul *ngFor="let topuser of topusers | async">
  <li class = "white" > 
      {{ topuser.username | json }}:
      {{ topuser.totalscore | json }}          
  </li>
</ul>

我的问题是，有没有办法控制*ngFor，所以从列表的第一个索引开始，从最后一个索引开始，到第一个索引结束？？

---

或者我是否可以控制FirebaseListObservable的索引，我想在浏览器上显示该索引？？？

您不一定要操纵ngFor的顺序，而是操纵传递到ngFor的数据。您可以使用.map方法反转从firebase observable返回的数据顺序

topusers: Observable<any>; // use Observable<> instead of FirebaseListObservable<> since .map is an rxjs method that returns the type Observable

constructor(){
    this.topusers = db.list('users', {
        query: {
            orderByChild: "totalscore",
            limitToLast: 10,
        }
    })
    .map(res => res.reverse());
}

---

因此，现在传递给ngFor的数组被反转。

您可以尝试向可观察对象添加一个映射函数，以反转返回顺序。mapres=>res.js以获取答案。。但是当我使用.mapres=>res.reverse时；在函数中，我发现了这个错误。用户说**[ts]类型“Observable”不可分配给类型“FirebaseListObservable”。类型“Observable”中缺少属性“$ref”。**我从'rxjs/Rx'导入导入{Observable}；要使用map right？？？@Zekelonas，您需要导入map函数。导入'rxjs/add/operator/map'；看起来这是一个常见的问题，因此您可以转向顶级用户：FirebaseListObservable；进入顶级用户：可观察；您还可以指定map函数返回FirebaseListObservable。