如何从Observable <Array <any >>中删除特定元素

Question

有一个Observable的地方数组:

places: Observable<Array<any>>;

在模板中,它与异步管道一起使用:

<tr *ngFor="let place of places | async">
  ...
</tr>

在一些用户操作之后,我需要从此数组中删除具有特定id的位置.我的代码中有这样的东西,但它不起作用:

deletePlace(placeId: number): void {
  this.apiService.deletePlace(placeId)
  .subscribe(
    (res: any) => {
      this.places
        .flatMap((places) => places)
        .filter((place) => place.id != placeId);
    }, 
    (err: any) => console.log(err)
  );    
}  

你能帮帮我吗？

Answer 1

你不能这样做,因为你不能"更新"一个observable(即它不保持状态),但你可以通过它对事件作出反应.

对于您的用例,我将利用scan运算符并将两个流合并为一个:

• 一个用于初始加载
• 另一个用于删除事件.

这是一个示例:

let obs = this.http.get('/data').map(res => res.json());

this.deleteSubject = new Subject();

this.mergedObs = obs.merge(this.deleteSubject)
.startWith([])
.scan((acc, val) => {
  if (val.op && val.op==='delete') {
    var index = acc.findIndex((elt) => elt.id === val.id);
    acc.splice(index, 1);
    return acc;
  } else {
    return acc.concat(val);
  }
});

要触发元素删除,只需发送关于主题的事件:

this.deleteSubject.next({op:'delete', id: '1'});

请参阅此plunkr:https://plnkr.co/edit/8bYoyDiwM8pM74BYe8SI ？ p = preview .