2017-07-24 27 views
1

我使用离子2来开发聊天应用程序,提供一些功能,如块,删除按摩等。我的问题块功能,我正在寻找一种方法来过滤Firebase名单通过使用其他列表Angularfire2 - 如何在Ionic 2中过滤多个FirebaseListObservable?

这里我的代码来获取列表

public chatList: FirebaseListObservable<any[]>; 
public blockList: FirebaseListObservable<any[]>; 
... 
... 
this.chatList = this.afd.list('/chats/',{ 
    query:{ 
     limitToLast:50 
    } 
}); 
this.blockList = this.afd.list('/blocks/'); 

,这是这些名单 tree of chats and blocks

的树的照片我试图用这种方式来过滤我的列表,但它不工作

HTML

<div *ngFor="let chat of chatList | async" [hidden]="filter(chat)"> 

TS

filter(chat):boolean{ 
    this.blockList.subscribe(data => { 
    data.forEach(block => { 
    if(block.blockFrom==this.userService.email && block.blockTo==chat.email){ 
     return true; 
    } 
    }) 
}) 
return false; 
} 

是否有任何其他方式来解决我的问题?

回答

0

由于我们正在使用Observables,因此他们不仅能够处理此用例。

合并两个Observable流,并映射出过滤的数据。 这样:

public chatList: FirebaseListObservable<any[]>; 
public blockList: FirebaseListObservable<any[]>; 
public filteredList: Observable<any[]>; 
... 
... 
this.chatList = this.afd.list('/chats/',{ 
    query:{ 
     limitToLast:50 
    } 
}); 
this.blockList = this.afd.list('/blocks/'); 
this.filteredList = Observable.combineLatest(this.chatList, this.blockList) 
    .map(([chats, blocked]) => { 
    let filtered: any[]; 
    ... // Do filtering here 

    return filtered; 
    }); 

HTML:

<div *ngFor="let chat of filteredList | async"> 

的最佳解决方案,但是,很可能会重新考虑你的火力地堡的数据结构(如果可能),那么过滤可以在代替的发生有客户。但上面应该这样做。

+1

谢谢你v.much @DarkNeuron。我检查了我们的代码,但我不知道为什么没有像以前那样显示数据。你可以学习我如何使用这个没有过滤器的组合列表来理解这个想法吗?因为我以前没有用过这种方式,所以我不知道如何显示filteredList的数据 –

+0

那么combineLatest将从每个Observable获取最新的发射;所以如果chatList得到更新,blockList将包含相同的值。所以基本上在map函数里面,你会对聊天数组进行正常的过滤,就像你已经做的那样。请记住:聊天记录是一组聊天记录,并且被阻止的是一组被阻止的记录。 – DarkNeuron

相关问题