如何仅针对第一个发出的值挖掘可观察值

Question

我想点击一个可观察量，以便在可观察量的第一个值发出时执行一个方法。我想这样做以便在 UI 中打开或关闭加载状态：

\n

我目前的方法

\n

// Current .create observable\npublic create = (entry: EntryPatch): Observable<Entry> =>\n  this.http.post<NodeResponse<Entry>>(this.serviceEndpoint, entry).pipe(\n    map((response: NodeResponse<Entry>) =>\n      upsertNode<Entry>(response.data, this.entriesStore)))\n

\n

以及我希望能够用它做什么

\n

public create = (entry: EntryPatch): Observable<Entry> =>\n  this.http.post<NodeResponse<Entry>>(this.serviceEndpoint, entry).pipe(\n    tapFirst(() => this.datastore.loading = true),  // \xe2\xac\x85\xef\xb8\x8f pseudocode\n    map((response: NodeResponse<Entry>) =>\n      upsertNode<Entry>(response.data, this.entriesStore)),\n    finalise(() => this.datastore.loading = false)) // \xe2\xac\x85\xef\xb8\x8f switch off loading indicator\n

\n

实现运算符的最佳方法是什么.tapFirst（因为它实际上不存在）？

\n

编辑

\n

正如@Lesiak 下面指出的，我上面提出的结构实际上是在服务器返回响应后启动加载指示器，这不是我的意图。Hoewver 甚至认为原来的问题是错误的，我要放弃它，因为已发布的答案仍然非常有用，并且解决了这个问题中隐含的两个请求

\n

a) 如何包装整个可观察\nb) 如何检测第一次发射

\n

Answer 1

您可以使用tap()和的组合来执行此操作map()，因为map()还传递每个的索引参数next：

this.http.post()
  .pipe(
    map((response, index) => [response, index]),
    tap(([response, index]) => {
        if (index === 0) { ... }
    }),
  )
  .subscribe(([response] => { ... })

当然，您可以将所有内容放入map((response, index => {...})然后返回相同的response对象，但最好避免在map().