【问题标题】:Activate observable again after unsubscribe取消订阅后再次激活 observable
【发布时间】:2016-12-21 14:54:34
【问题描述】:

我有一个切换按钮和一个日历,看起来像

正如您在图片上看到的,edit 是一个切换按钮,当按下它时,日历将是可编辑的。

编辑切换按钮被定义为hot observable:

let oEditOb = this._createEditObservable(this.getById("cal-edit"));
_createEditObservable: function (oEditBtn) {
      return Rx.Observable.create(function (subscriber) {
        oEditBtn.attachPress(function (oEvent) {
          subscriber.next(oEvent);
        });
      });
    },

还有日历上的选择事件:

let oCalendarSelectOb = this._createCalendarSelectObservable(this.getById("calendar-view"));

    _createCalendarSelectObservable: function (oCalendar) {
      return Rx.Observable.create(function (subscriber) {
        oCalendar.attachSelect(function (oEvent) {
          subscriber.next(oEvent);
        })
      });
    },

当切换按钮被按下时,它将切换到可观察的日历。为了澄清考虑以下代码sn-p:

_processCalenderSelect: function (oCalendarSelectOb, oEditButtonOb) {
      let self = this;

      return oEditButtonOb
        .filter(function (oBtn) {
          return oBtn.getPressed();
        })
        .switchMapTo(oCalendarSelectOb)
        .mergeMap(function (oCalendar) {
          return Rx.Observable.from(oCalendar.getSource().getSelectedDates());
        })
        .map(function (oDateRange) {
          return oDateRange.getStartDate();
        });

    },

一旦它切换到可观察日历,那么日历将永远可编辑,即使我按下切换按钮以禁用edit 模式。

我试图取消订阅日历选择 observable:

oEditPressedOb.subscribe(function (oSource) {
        if(!oSource.getPressed()){
          oSubscription.unsubscribe();
        }
        console.log(oSource);
      });

但是在再次启用edit 模式后,日历选择将不再流式传输。

【问题讨论】:

  • 所以,基本上,当oEditOb 被第二次点击时,您需要停止从_processCalenderSelect 发出日期?
  • 我怎样才能停止发射?

标签: javascript rxjs reactive-programming rxjs5


【解决方案1】:

尝试使用combineLatest:

_processCalenderSelect: function (oCalendarSelectOb, oEditButtonOb) {
  let self = this;

  let selectedDates = oCalendarSelectOb
    .mergeMap(function (oCalendar) {
      return Rx.Observable.from(oCalendar.getSource().getSelectedDates());
    })
    .map(function (oDateRange) {
      return oDateRange.getStartDate();
    });

  return Rx.Observable
    .combineLatest(
      oEditButtonOb.map(function (oBtn) {
        return oBtn.getPressed();
      }),
      selectedDates
    )
    .filter(function (input) {
      return input[0];
    })
    .map(function (input) {
      return input[1];
    });
},

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2020-12-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-03-19
    • 1970-01-01
    • 2018-12-15
    相关资源
    最近更新 更多