在我的Angular服务中,我有以下方法:

// creates an Item and returns the ID of the created Item
createItem(item: Item): Observable<ItemId> {
    return this.http.post<ItemId>('some_api_url', item);
}

// returns all Items
getAllItems(): Observable<Item[]> {
    return this.http.get<Item[]>('some_api_url');
}

在我的模板中,我正在列表中显示项目。

我希望能够创建一个新项目,然后重新加载列表(以包括新创建的项目),因此我实现了以下内容:
this.itemService.createItem(item)
    .pipe(
      switchMap(createdId => this.itemService.getAllItems())
    ).subscribe(result => {
      this.items = result;
    });

这似乎工作正常,但最后我还要对createdId进行一些处理:
this.itemService.createItem(item)
    .pipe(
      switchMap(createdId => this.itemService.getAllItems())
    ).subscribe(result => {
      this.items = result;

      // i would like to use createdId here as well
    });

因此,我提出了以下建议:
this.itemService.createItem(item)
    .pipe(
      switchMap(createdId =>
         combineLatest(this.itemService.getAllItems(), of(createdId)))
    ).subscribe(result => {
      this.items = result[0];

      // doing some stuff with result[1], which is the value of createdId
    });

但是必须在combineLatest中使用switchMap并显式将createdId设置为Observable,这使我想知道这是否是一个好的解决方案。

所以基本上我想创建和项目,更新列表(当项目创建完成时),并在更新完成时使用已创建项目的ID。

有一个更好的方法吗?

我真的很感谢任何建议。

最佳答案

在深入研究RxJS运算符后,我发现最干净的解决方案可能是简单地将concattoArray结合使用:

// import { concat } from 'rxjs';
// import { toArray } from 'rxjs/operators';

concat(
  this.itemService.createItem(item),
  this.itemService.getAllItems())
    .pipe(toArray())
    .subscribe((result: [ItemId, Item[]]) => {
      // result[0] is the ItemId
      // result[1] is the Item[]
    });

10-06 12:26