2017-07-24 71 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

相關問題