Question

我有一个应用程序，用户可以在其中调用2个操作：

获取商品列表
添加项目

对于这两种操作，视图应显示当前项目。使用rxjs运算符有什么优雅的方法吗？

当前实施：

ngOnInit(): void {
    this.getItems();
    }

addItem = () => {
    this.addedItem$ = this.httpClient.post(url,
      { name: 'foo'}
    ).subscribe(() => {
        this.getItems();
      });
  }

 private getItems() {
    this.items$ = this.httpClient.get(url);
  }

模板：

<div *ngFor="let item of items$ | async">
    {{item.name}}
  </div>

我不想每次添加新项目时都获取所有项目的列表。如果可以将两个流合并在一起会更好。

Answer 1

您可以将获取的项目存储在纯js数组中，而不是使用可观察的对象。添加新项目后，您可以将新项目推入此数组。

var temp = ScheduleInMonths[row].Schedules;
temp[col].Clear();

ScheduleInMonths[row].Schedules = temp;

编辑：或使用items = []; ngOnInit(): void { this.getItems(); } addItem = () => { const item = { name: 'foo'}; this.httpClient.post(url, item) .subscribe(() => this.items.push(item)); } private getItems() { this.httpClient.get(url) .subscribe(items => this.items = items) } <div *ngFor="let item of items"> {{item.name}} </div>

BehaviorSubject

用rxjs组合两个可观察对象

1 个答案: