Angular 2 & RxJS - 从 2 个来源排序

Question

我有一个通过 Observable 从服务器返回的对象列表。该列表显示在带有 ngFor 的模板中。我还有一个下拉列表来对列表进行排序。

当服务器 returns 列表时，我的排序工作正常，但现在我试图在选择组合框时也对列表进行排序。

如何从下拉列表和源中对流进行排序，而不必使用局部变量来存储数据？

示例代码：

let sortButton$ = new Subject();
let sortProp = 'myProperty';

this.handleSortButton(sortProp) {
    sortButton$.next(sortProp);
}

// how can I retain my Observable and sort the values from the server when 
// a) the values come back from server (works with below)
// b) the sort dropdown sends a new property value via the subject
this.test$ = Observable
                .of(['one', 'two', 'three'])
                .map((data) => _.sortBy(data,this.sortProp));

模板：

<div *ngFor='let item of test$'>

Answer 1

您可以使用 combineLatest:

this.test$ = Observable
  .of(['one', 'two', 'three'])
  .combineLatest(this.sortButton$.startWith(this.sortProp))
  .map(([data, sort]) => _.sortBy(data,sort))

别忘了导入它：

import 'rxjs/add/observable/combineLatest';
import 'rxjs/add/operator/startWith';

Angular 2 & RxJS - 从 2 个来源排序

Angular 2 & RxJS - Sort from 2 sources

rxjs5

angular