当 Http 完成以随后运行另一个函数时,Angular 2 发出

标签 angular ngrx

我有一个通用功能,可以对我的 API 进行 DELETE 调用。函数是这样的:

deleteItem(url, item, action) {
    return this.http.delete(url)
        .subscribe(
            () => this.store.dispatch({ type: action, payload: item }),
            error => this.errorHandler(error),
            () => console.debug('Delete complete')
        )
    ;

我从几个地方调用这个函数,发送不同的 url、项目和操作。假设我有一个这样的函数:

deleteBookcase(bookcase) {
    this.apiService.deleteItem(BOOKCASE_URL, bookcase, BOOKCASE_REMOVE);
}

有时,我想在某个项目从 API 中删除后触发另一个操作。例如,也许我想检查我的全局书库在我移除书柜后是否发生了变化。

有没有一种简单的方法可以让我的 deleteBookcase 函数知道 HTTP 调用和后续操作已经完成,然后再过早地触发额外的操作?

最佳答案

deleteItem()中使用map()代替subscribe()

deleteItem(url, item, action) {
    return this.http.delete(url)
        .map(() => this.store.dispatch({ type: action, payload: item })
        .catch((error) => this.errorHandler(error))
        .do(() => console.debug('Delete complete'))
 });
}

并在调用 deleteItem() 的地方订阅

deleteBookcase(bookcase) {
    this.apiService.deleteItem(BOOKCASE_URL, bookcase, BOOKCASE_REMOVE)
    .subscribe(data => doSomething());
}

不要忘记导入domapcatch

关于当 Http 完成以随后运行另一个函数时,Angular 2 发出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38075801/

相关文章:

angular - 如何本地化我的 Angular 11 库?

angular - 无法在 Reactive 表单的 <ion-select> 上设置默认选择

javascript - Angular 6 - 日期管道

angular - 使用 ngrx 存储进行身份验证的路由防护

angular - 如何使用具有 5 个以上 Action 的 ofType?

node.js - 如何处理加载大集合的所有记录并监听 mongodb atlas 上的新数据?

angular - 请求的资源上不存在 'Access-Control-Allow-Origin' header - ionic 2 应用程序

angular - 为什么我没有得到任何数据? Ngrx

angular - 类型 'map' 上不存在属性 'Subject<{}>'

javascript - 在 ngrx 中的订阅内部进行管道传输