typescript - 异步 HTTP 请求的顺序

标签 typescript angular angular2-routing angular2-http

基本上我有一个包含元素列表的组件和一个详细信息组件,您可以在其中编辑或添加新元素。

在我通过 http 服务(this.myservice 基于文档 https://angular.io/docs/ts/latest/tutorial/toh-pt6.html 中的 hero.service.ts)向我的服务器添加元素之后。然后直接跳回element组件列表。

我使用 Zone,因此会调用 ngOnInit。 Angular 2 ngOnInit not called

问题是元素列表经常没有用新元素更新。我想异步 HTTP 请求的顺序搞混了。

一个好的解决方案应该是什么样的?

export class DetailElemComp {
    this.myService.addElem(this.elem)
      .subscribe(
        error => this.errorMessage = <any>error);
    this.zone.run(() => this.router.navigate(['ListComponent']));
}
export class ListOfElemComp {
    ngOnInit() {
        this.myService.getElems()
          .subscribe(
            elems => this.elems = elems,
            error => this.errorMessage = <any>error);
    }
}

最佳答案

好吧,就像你说的,这是一个异步请求。因此,如果您想在请求完成后执行某些操作,我建议将该逻辑移至 subscribeonCompleted 回调 lambda 中。像这样的功能:

export class DetailElemComp {
    this.myService.addElem(this.elem)
      .subscribe(
        data => null,
        error => this.errorMessage = <any>error,
        () => this.zone.run(() => this.router.navigate(['ListComponent']))
      );
}

subscribe 调用下方的代码将在 subscribe 方法内部的回调执行之前运行。

关于typescript - 异步 HTTP 请求的顺序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38063658/

相关文章:

angular - 为什么 Asp net Core 会为我的 Angular Spa dist 文件的请求返回 index.html?

angularjs - 手动粘贴 URL 时无法加载文件 Angular 2 路由?

angular - 多次调用angular2路由守卫

javascript - 在 Angular 2 中使用字符串插值生成电子邮件链接

typescript - 为什么观察者未定义

javascript - 带有 React 组件加载图像的 SharePoint 框架

jquery - 在两个 angular.json 和 Angular 模块中使用 jQuery

css - 在 typescript 中添加和删除类

Angular2 RC6 : '<component> is not a known element'

typescript - 在 Angular2 中实现动态路由(Typescript)