* ngIf Firestore with Querying Collections / angularfire2

时间:2018-05-23 15:10:51

标签: angular firebase google-cloud-firestore angularfire2

我正在使用Firestore,我需要按publicado过滤我的数据,然后按fechaCreacion对其进行排序。然后我尝试了这个:this.afs.collection ('avisos', ref => ref.where ('publicado', '==', true) .orderBy ('fechaCreacion', 'desc')).valueChanges()

但根据文档,Firestore不允许这样做。然后,我被单独留下了订单:this.afs.collection ('avisos', ref => ref.orderBy('fechaCreacion', 'desc')). valueChanges(),我正在尝试使用*ngIf仅显示publicado = true

<div *ngFor="let aviso of avisos | async as aviso" class="col-xl-2 col-lg-3 col-md-4 col-sm-6 col-6 my-1 px-1">
  <div *ngIf="aviso.publicado">
    <h6>{{ aviso.titulo }}</h6>
    <p>{{ aviso.descripcion }}</p>
  </div>
</div>

在某种程度上,我解决了这个问题,但我留下了这些空白。我怎么解决这个问题? enter image description here

1 个答案:

答案 0 :(得分:2)

过滤打字稿中的数据,如下所示:

this.avisos = this.afs
    .collection('avisos', ref => ref.orderBy('fechaCreacion', 'desc'))
    .valueChanges()
    .map(data => data.filter(d => d.publicado));

或在您的查询中通过Firestore过滤(首选方式):

this.avisos = this.afs
    .collection('avisos', ref => ref
       .orderBy('fechaCreacion', 'desc'))
       .where('publicado', '==', true)
    .valueChanges();

首先订购,然后过滤。