javascript - 在 Angular App 中使用 Observables 和过滤数组列表

Question

我在我的 Angular 应用程序中使用可观察对象，它按预期工作。但是，我遇到了一种有点令人困惑的情况。在一个组件中，我成功订阅了可观察对象，然后过滤结果，如下所示:

this.clientsService.getAll()
    .subscribe(resRecordsData => {
        this.records = resRecordsData;
        this.inactiveRecords = this.records.filter(record => record.category && record.category.includes('inactive'));
        this.records = this.inactiveRecords;
    },
    responseRecordsError => this.errorMsg = responseRecordsError);

但是，在另一个组件中，当我做几乎相同的事情时，我在控制台上打印了一条错误消息:

EXCEPTION: _this.records.filter is not a function

这就是那个组件的样子:

optionReceived(option) {
    console.log('Consulting: ' + option.toolbarLabel);
    if (option.toolbarLabel === 'OT') {
        console.log('Consulting: OT Filter Activated!');
        this.clientService.getByCategory('consulting', 1, this.pagesize)
        .subscribe(resRecordsData => {
            this.records = resRecordsData;
            this.OTRecords = this.records.filter(record => record.type && record.type.includes('OT'));
            this.records = this.OTRecords;
        },
        responseRecordsError => this.errorMsg = responseRecordsError);
    } else {
        return this.records;
}

第二种情况的问题是什么？为什么我在那里收到错误而不是第一种情况？

Answer 1

订阅前为什么不过滤

this.clientsService.getAll()
    .filter(record => record.category && record.category.includes('inactive'))
    .subscribe(
        resRecordsData => {
            this.records = resRecordsData;
        },
        err => this.errorMsg = err
    );

我相信 Angular 使用 RxJS，引用 http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html#instance-method-filter