Angular 2,可观察到的共享服务中的并发性

马西莫·马利亚尼(Massimo Magliani)

我有一个共享服务(从开始这个建议),该高速缓冲存储器,并返回第一HTTP请求后一些数据:

export class SharedService {
  constructor(private http:Http) {
  }

  getData() {
    if (this.cachedData) {
      return Observable.of(this.cachedData);
    } else {
      return this.http.get(...)
            .map(res => res.json())
            .do((data) => {
              this.cachedData = data;
            });
    }
  }
}

我的问题是,我在同一模板中有一些指令和组件,这些指令和组件都在同一时间初始化,并且每个指令同时调用(在ngInit函数内部)getData方法(在第一个成功执行之前,所有这些指令和组件),因此服务启动许多http请求,而不是返回缓存的数据。有人可以建议我如何避免这种副作用吗?

贡特·佐赫鲍尔(GünterZöchbauer)

您的解决方案无法涵盖所有​​情况。

将其与我从https://stackoverflow.com/a/36291681/217408的方法进行比较

getData() {
    if(this.data) {
      // if `data` is available just return it as `Observable`
      return Observable.of(this.data); 
    else if(this.observable) {
      // if `this.observable` is set then the request is in progress
      // return the `Observable` for the ongoing request
      return this.observable;
    } else {
      // create the request, store the `Observable` for subsequent subscribers
      this.observable = this.http.get('/someUrl')
          .map(res => res.json())
          .do(val => {
            this.data = val;
            // when the cached data is available we don't need the `Observable` reference anymore
            this.observable = null;
          })
          // make it shared so more than one subscriber can get the result
          .share();
      return this.observable;
    }
}

在请求没有返回之前,您需要Observable将从第一个请求创建的请求返回到后续请求,直到第一个请求完成为止。

https://stackoverflow.com/a/36296015/217408也显示了一种有趣的方法,但存在一个小的(取决于您的要求)缺点,即无法取消请求。

还要确保您仅以提供者身份注册过一次共享服务(如@MichaelD所述)。

Angular团队建议使用providers: [...]根组件列表,而不是bootstrap(...)技术原因。他们认为它更具可维护性。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

可观察到的服务在组件NgOnInIt中不起作用-Angular2

停止可观察到的共享数据服务Angular流

Angular2可观察到的共享不起作用

Angular 2缓存可观察到的http结果数据

Angular 2可观察到多个订户

Angular2可观察到的回调

Angular2 @ TypeScript可观察到的错误

Angular2 TypeScript可观察到的问题

angular2 rxjs可观察到的forkjoin

订阅Angular 8中可观察到组件的问题

每次在Angular 2中满足条件时,rxJS即可观察到重复调用

Angular 2无法在可观察到的回调中访问它

如何在angular2中手动引发可观察到的错误?

如何取消订阅或处理Angular2或RxJS中可观察到的间隔?

Angular2-在routerOnDeactivate()中可观察到的停止/取消/清除

在Angular2中可观察到的组件属性变化

Angular HTTP可观察到的元组

共享服务在 angular 2 中不起作用

在angular2中编写共享服务

可观察到的在angular2中不接收下一个值

在Angular2中,如何拦截可观察到的错误响应并将其传递给错误通道

Angular 2组件中的单元测试“成功”和“错误”可观察到的响应

返回可观察到的内部可观察到的可激活Angular 4防护

rxjs + angular:错误“杀死”可观察到的Web服务调用错误

可观察到的Angular服务返回嵌套数组数据

Angular 8:从可观察到的RxJS中过滤结果(来自Angular.io教程)

Angular 2-共享服务的实现

Angular 2-使用共享服务

angular2等到条件可观察到完成