如何在 *ngFor 循环之前调用函数？ ::角2

Question

首先，我有一个http请求，看起来像：

private getValues() {
  this._watchlistElements.map(v =>
    this.http.get('http://localhost:8080/getValue/' + v.xid)
    .subscribe(res => {
      this._values.push(res.json());
    }));
};

一切正常，但问题是它返回了一个混乱的、未排序的对象数组。我要排序，所以我做了一个单独的排序函数：

private sortPoints(){
  this._values.sort((a,b) => a.ts - b.ts);
}

_values 变量中的元素由*ngFor 循环显示：

<tr *ngFor="let elem of _values">

getValues() 函数每隔 5 秒被调用一次：

this.loadPoints = setInterval(() => {
  this.getValues();
}, 5000);

现在我必须在某处调用排序函数 - sortPoints()。我认为这种方式会很好：

this.loadPoints = setInterval(() => {
  this.getValues();
  this.sortPoints();
}, 5000);

但不幸的是它不会影响数组。 *ngFor 循环只是用未排序的元素填充表格。但如果我只是做一个简单的按钮：

<button (click)="sortPoints()">Sort it!</button>

数组正在动态排序，就在按钮单击之后。

那么我的问题是您是否还有其他想法将函数放置在何处以使该机制起作用？

非常感谢任何帮助。

EDIT 实施了@Sasxa 解决方案，收到以下错误：

Answer 1

您可以链接可观察的运算符并处理流，因此最后（当您订阅时）您可以根据需要获得值：

private getValues() {
  this._watchlistElements.map(v =>
    this.http.get('http://localhost:8080/getValue/' + v.xid)
      .map(res => res.json())
      .map(data => this._values.push(data))
      .map(() => this._values.sort((a,b) => a.ts - b.ts))
      .subscribe(sorted => this._values = sorted));
};