从可观察数组中获得属性值的总和

Question

我有一个可观察数组，并且希望获得该数组中的属性值的总和。我的数组被定义为：

public bookStores $：Observable;

我打算做一个简单的for循环，并计算总和，但是我在尝试使用我的数组的count属性时语法错误：

Operator '<' cannot be applied to types 'number' and '<T>(this: Observable<T>, predicate?: (value: T, index: number, source: Observable<T>)=>boolean)... 

这当我这样做时：

for (let i = 0; i < this.bookStores$.count; i++){ } 

我的BookStore对象数组中的每个项目都有一个名为numberOfBooks的属性。获取BookStore数组中每个BookStore对象上包含的值的总和的正确方法是什么？

Answer 1

This is why you're getting unexpected results for Observable.count
要得到的结果阵列lenght，你需要做的，是这样的：

BookStoreService.ts

... 
getBookStore() : Observable<Bookstore> { 
    this.bookstore$ = this.http.get(...) 
     .map((response:Response) => response.json()) 
     .map(response => response.bookstore); // optional depends if JSON payload you want is wrapped inside some other container 
    return this.bookstore$; 
} 

Component.ts

... 
    bookstore$ : Observable<Bookstore>; 
    bookstores: Bookstore[]; 
    numberOfBookStores:number; 
    constructor(private bookService:BookService) {} 

    .. 
    this.bookService.getJobs() 
    .subscribe(
    bookstores => {this.bookstores = bookstores; 
        this.numberOfBookstores = this.bookstores.length; 
        }, 
    err  => { this.bookstores = [] as BookStore[]; 
        // Caters for 404 etc error - be sure to be more robust in final code as you may want to indicate types of error back to user. 
        }, 
    ()  => { 
        } 
    ); 

更新：
如果你只需要循环访问您的HTML模板中的列表，然后 然后将书店数组定义为属性将不是必需的。我这样做是为了说明如何获得返回的书店集合的大小。

您可以使用此类型的语法：

<tr *ngFor="let bookstore of (bookstore$ |async) as bookstores; 
      trackBy bookstore?.id; let i = index"> 
    <td>{{bookstore.numberofBooks}} 
<tr/> 

您可以了解更多有关：

• *ngFor trackBy, even, odd, first, last here。
• 使用异步管道与HTML模板的整个块作为here

而且看看像Lodash并强调库总结册数的计数。我自己并没有使用Underscore。 这是simple example为您开始。

如果你想获得更多的冒险看看这个Functional Programming in Javascript Tutorial