【问题标题】:Angular 6 rxjs observable not alert when next()Angular 6 rxjs observable 在 next() 时不会发出警报
【发布时间】:2019-01-15 18:13:25
【问题描述】:

我用 typescript 为我的游戏构建了一个加载系统。我有一些层:游戏>场景>元素>精灵>带有加载事件的html图像。所有通过 observable 等待。

首先我有一个带有多个 html 图像的精灵,所以我有一个加载功能

  public load(): Observable<boolean> {
    this.loadingObs = new Observable((observer) => {
      const layerNames = Object.keys(this.conf.layers);
      let nLayer: number = 0;
      layerNames.forEach((k) => {
        this.loadImage(k).subscribe((loadResult) => {
          if (loadResult) {
            nLayer++;
          }

          if (nLayer === layerNames.length) {
            this.loaded = true;
            observer.next(true);
            observer.complete();
          }
        });
      });
    });

    return this.loadingObs;
  }

以及一种检索可观察对象的方法

  public getLoadingObs(): Observable<boolean> {
    return this.loadingObs;
  }

这个想法是:如果有 N 个元素想要加载相同的 Sprite,我为我的图像加载事件创建一个可观察对象,存储可观察对象并为下一个想要它的元素提供可观察对象。因此,当图像加载完成时,所有元素都会通过可观察订阅接收“通知”。它工作。

关于游戏 > 场景 > 元素 > 精灵,一切都是关于机制的

  public load(): Observable<boolean> {
    return new Observable((observer) => {
      let nRefs = 0;
      const spriteRefs = this.getSpritesRefs();

      // Load all needed sprites
      spriteRefs.forEach((ref) => {
        this.resources.loadSprite(ref).subscribe((loadFinished) => {
          if (loadFinished) {
            nRefs++;
          }

          if (nRefs === spriteRefs.length) {
            this.afterLoadInit();

            observer.next(true);
            observer.complete();
          }
        });
      });
    });
  }

我的 loadSprite 服务函数从 sprite 中获取新的 observable,或者像之前解释的那样检索它。但是我只有在创建和订阅时才会收到通知,而在检索和订阅时不会收到通知。 (它就在前面工作)

所以图像加载是可以的,通过所有层可以观察到一些可以很好地沟通,但不是全部。因此,如果我等待 26 个加载状态,我会收到 5 个(5 个实际负载),那么为什么 sudently observable 没有像以前那样将 next() 函数传播给所有订阅者?

我迷路了,我不知道更容易调试 observable 的工具或技术。我尝试了点击/执行方法但没有成功。并且 console.log 是异步的混合原因。

提前感谢您的任何帮助或建议

【问题讨论】:

    标签: typescript observable angular6 rxjs6


    【解决方案1】:

    解决方案是使用 eventEmitter 而不是 observable。更多关于广播问题的建议。

    【讨论】:

      猜你喜欢
      • 2019-12-02
      • 1970-01-01
      • 2019-02-21
      • 2018-11-02
      • 1970-01-01
      • 2018-09-30
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多