Javascript Firestore:数组索引不正确？

目前，我正在和firestore混日子，只是为了把基本的东西弄下来。但是，我在读取数据（作为集合中的文档数组）时遇到了问题，因为它是按我无法理解的顺序编制索引的。与实时数据库相比，它是根据推送到firebase的时间进行订购的。我知道现在firestore中有索引的实现，这就是为什么我在文档的字段中创建了“timeCreated”时间戳

问题是：试图在将数据推送到firestore时按时间顺序读取数据，并在hmtl中以相同的顺序显示数据。以奇怪的顺序出现

仍然在学习，所以这个问题可能比我意识到的更明显，提前谢谢

HTML:

离子空白
提交


偷看


负载
{{person.name}
年龄：{{person.Age}

性别：{{person.Sex}

种族：{{person.Race}

TS:

从'@angular/core'导入{Component}；
从'ionic angular'导入{NavController}；
从“firebase”导入firebase；
导入“firebase/firestore”；
@组成部分({
选择器：“主页”，
templateUrl:'home.html'
})
导出类主页{
公共名称：字符串；
公众年龄：字符串；
公众性别：字符串；
公开赛：弦乐；
公共db；
公共colRef；
公共文件参考；
公众人物：阵列

应用程序内数据显示/顺序：

从firestore检索到的数据阵列的控制台日志：
我知道我可以在TS中完成对我的数组的推送后对其重新排序，但我宁愿不只是从概念上说我不应该从bc开始。只需运行查询，然后检查日志。Firestore将为您提供一个
单击此处
来创建索引响应，即只需按照instructions@RonRoyston我想是点菜吧仅仅在控制台中添加索引是不够的，所以在引用集合时，我还需要添加orderBy（“timeCreated”，“asc”），这看起来有点奇怪，但不管怎样。
<ion-header>
  <ion-navbar>
    <ion-title>
      Ionic Blank
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
 <ion-input placeholder = "Your name" [(ngModel)] = "name" >  </ion-input>
 <ion-input placeholder = "Your age" [(ngModel)] = "age" >  </ion-input>
 <ion-input placeholder = "Your sex" [(ngModel)] = "sex" >  </ion-input>
 <ion-input placeholder = "Your race" [(ngModel)] = "race" >  </ion-input>

 <button ion-button (click) = "submit()"> Submit </button>
 <br>
 <button ion-button (click) = "peek()"> Peek </button>
 <br>
 <button ion-button (click) = "load()"> Load </button>

 <ion-item *ngFor = "let person of people">
  <h3> {{person.name}} </h3>
  <p> Age: {{person.age}}</p>
  <p> Sex: {{person.sex}}</p>
  <p> Race: {{ person.race }}</p>
 </ion-item>


</ion-content>

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import firebase from "firebase";
import "firebase/firestore";

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  public name: string;
  public age: string;
  public sex: string;
  public race: string;
  public db;
  public colRef;
  public docRef;
  public people: Array<any>;

  constructor(public navCtrl: NavController) {
    this.db = firebase.firestore(); 
    this.colRef = this.db.collection("people");
  }

  submit(){
    this.db.collection("people").add({
      name: this.name,
      age: this.age,
      sex: this.sex,
      race: this.race,
      timeCreated: new Date().getTime()
    }).then(cont => {
      alert("Data uploaded!");
      this.name = "";
      this.age = "";
      this.sex = "";
      this.race = "";
    });
  }

  peek(){
    alert("Name: "+ this.name);
  }

  load(){
    this.colRef.get().then( snapshot => {
      this.people = [];
      snapshot.forEach(doc => {
        var data = doc.data();
        this.people.push({
          id: doc.key,
          name: data.name,
          age: data.age,
          sex: data.sex,
          race: data.race,
          timeCreated: data.timeCreated
        });
      });
      console.log(this.people);

    });
  }
}