【问题标题】:IONIC 5: Issues in changing Events to ObservableIONIC 5:将事件更改为可观察的问题
【发布时间】:2020-06-01 01:35:22
【问题描述】:

自从 Ionic 5 推出后,我决定尝试一下。 我了解到他们现在使用的是 Oberservables 而不是事件。 我的代码中有以下事件:

在我的构造函数中这样订阅:

                this.events.subscribe('go-to-slide', (tab, id) => {
  this.currentID = id;
  if (id === 0) {
    this.showLeftButton = false;
  }
  // if data has already been loaded
  if (this.dataLoadedFlag === true) {
    // from tile
    if (this.globalVariableService.comesFromTileClick === true) {
      if (this.globalVariableService.languageChanged === true) {
        this.languageChanged = false;
        this.slidesComponent.slides.slideTo(id, 0);
        this.getSectorTitlesAndColours();
        this.dataLoadedFlag = true;
        this.updateHeader(id);
      } else if (this.globalVariableService.languageChanged === false) {
        this.updateHeader(id);
      }
    } else if (this.globalVariableService.comesFromTileClick === false) {

    }
  } else if (this.dataLoadedFlag === false) {

    if (this.globalVariableService.comesFromTileClick === true) {
      this.slidesComponent.slides.slideTo(id, 0);
      this.getSectorTitlesAndColours();
      this.dataLoadedFlag = true;
      this.updateHeader(id);
    } else if (this.globalVariableService.comesFromTileClick === false) {
      this.getSectorTitlesAndColours();
      this.showRightButton = true;
      this.dataLoadedFlag = true;
      this.updateHeader(0);
    }
  }
  const tempGlobalVariableService = this.globalVariableService;
  // tslint:disable-next-line: only-arrow-functions
  setTimeout(function() {
    tempGlobalVariableService.comesFromTileClick = false;
  }, 500);
});
}

并在不同的组件/方法中像这样发布事件:

this.events.publish('go-to-slide', 1, 1);

我尝试了不同的方法来将此代码更改为可观察的,但我似乎找不到正确的方法。

任何人已经尝试过并且可以帮助我吗? 谢谢

【问题讨论】:

标签: javascript angular events observable ionic5


【解决方案1】:

我已经在这里回答了https://stackoverflow.com/a/60246906/2405040

您可以为此创建一个小型服务,例如:

import {Injectable} from '@angular/core';
import {Subject} from 'rxjs';

@Injectable({
    providedIn: 'root'
})
export class GlobalFooService {

    private fooSubject = new Subject<any>();

    publishSomeData(data: any) {
        this.fooSubject.next(data);
    }

    getObservable(): Subject<any> {
        return this.fooSubject;
    }
}

完整示例请参考其他答案。

顺便说一下,讨论一下这个评论:

我了解到他们现在使用 Oberservables 而不是事件

这不是真的。基本上,他们已经从 Ionic 5 中删除了Events 服务,并要求我们通过创建我们自己的类似实现来使用Observables

他们可能自 Ionic 3 以来一直在内部使用 Events。但自 Ionic 4 以来,他们已经删除了内部使用,因为 Obersables 发展得如此之快,它是 Angular 和 Ionic 的一种支柱。

【讨论】:

  • 嗨,我尝试使用你的建议,我现在唯一的问题是在订阅时我需要传递参数(tab,id)并且我已将代码更改为:publishGoToSlide(tab:any,id :any) { this.GoToSlideObservable.next(tab); this.GoToSlideObservable.next(id);} 并且在订阅中它不允许我像上面那样传递两个参数......我该怎么做呢?这就是我在我的组件中订阅的内容: this.eventservice.goToSlideObserveble().subscribe((tab,id) => { // 此处的代码 } 传递上面的两个参数时出现错误
  • 没关系,我知道我做错了什么。谢谢你:)
猜你喜欢
  • 2017-12-12
  • 1970-01-01
  • 1970-01-01
  • 2018-12-02
  • 1970-01-01
  • 2017-03-08
  • 2015-10-18
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多