Angular2：Sum two Observable <number> values

Question

我有一個具有兩個不同函數的服務，它們獲取由BehaviorSubject監視的數組內的itens數量。

private itemsInCartSubject: BehaviorSubject<any[]> = new BehaviorSubject([]); 
private itemsInCart: any[] = []; 

private packetsInCartSubject: BehaviorSubject<Pacote[]> = new BehaviorSubject([]); 
private packetsInCart: Pacote[] = []; 

public getTotalItens(): Observable<number> {   

    return this.itemsInCartSubject.map((items: any[]) => { 
     return items.reduce((prev, curr: any) => {    
       return prev + Number(curr.qtd);     
     }, 0); 
    }); 
}; 

    public getTotalPacotes(): Observable<number> { 
    return this.packetsInCartSubject.map((items: any[]) => { 
     return items.reduce((prev, curr: any) => {    
       return prev + Number(1);     
     }, 0); 
    }); 
}; 

裏面我的組件我有兩個方法來獲取這些數字：

public countItens(): Observable<number> { 
    return this.cartService.getTotalItens(); 
} 

public countPacotes(): Observable<number> { 
    return this.cartService.getTotalPacotes(); 
} 

在我的HTML我可以顯示這樣的價值觀：

<p>You have {{countItens() | async}} in your cart</p> 

它工作正常，更新值是什麼時候是主題的變化，但我需要將兩個觀測值的兩個值相加。

我該如何做到這一點？

我已經試過

this.cartService.getTotalItens()+this.cartService.getTotalPacotes(); 

但它產生的錯誤：操作「+」不能應用於類型的可觀察和可觀察

Answer 1

可以使用combineLatest組合這些觀測量，然後返回一個新的值這是兩者的總和。您可以添加新的功能是這樣的：

public getTotal(): Observable<number> { 
    return this.countItens() 
       .combineLatest(this.countPacotes(), (itens, pacotes) => itens + pacotes); 
} 

然後在模板你可以使用它像這樣：

<p>Total is: {{getTotal() | async}}</p> 

Demo of combineLatest