如何对从Cloud Firestore提取的数据进行排序

时间:2019-10-09 08:03:25

标签: angular typescript firebase google-cloud-firestore

我正在使用一种服务来从我的Firestore集合中获取数据,现在我要做的是按一个表示“日期”的字段对文档进行排序 附上以下代码:

BARCODE.SERVICE.TS

import { Injectable } from '@angular/core';
import { AngularFirestore, AngularFirestoreCollection, AngularFirestoreDocument } from '@angular/fire/firestore';
import { Observable } from 'rxjs';
import { Barcode } from '../models/barcode';
@Injectable({
  providedIn: 'root'
})
export class BarcodeService {
  barcodesCollection: AngularFirestoreCollection<Barcode>;
  barcodes: Observable<Barcode[]>;
  constructor(public afs: AngularFirestore) { 
    this.barcodesCollection = this.afs.collection('barcodes');

    this.barcodes = this.barcodesCollection.valueChanges();
  }
  getBarcodes(){
    this.barcodes = this.afs.collection('barcodes').valueChanges();
    return this.barcodes;
  }

  addBarcode(barcode: Barcode) {
    this.barcodesCollection.add(barcode);
  }
}

COMPONENT.TS (仅显示必填部分)

ngOnInit() {
    this.barcodeService.getBarcodes().subscribe(barcodes => {
      this.barcodes = barcodes;
    });
  }

COMPONENT.HTML

<div *ngIf="barcodes.length > 0;else noBarcodes">
        <div *ngFor="let barcode of barcodes">
            <a (click)="viewdet(barcode.id)"><table >
                    <tr>
                        <td><h3 class="big"><b>{{barcode.vendor}}</b></h3></td>
                        <td rowspan="3"><span>&#8250;</span></td>
                    </tr>
                    <tr>
                        <td><h3><b>Reel No:</b> {{barcode.reelno}}</h3></td>
                    </tr>
                    <tr>
                        <td><h3><b>Date:</b> {{barcode.date}}</h3></td>
                    </tr>


            </table></a>
        </div>
    </div>

1 个答案:

答案 0 :(得分:2)

根据documentation,以下操作应该有效(但是未经测试):

  getBarcodes(){
    this.barcodes = this.afs.collection('barcodes', ref => ref.orderBy('date')).valueChanges();
    return this.barcodes;
  }