时间戳

首页 > 解决方案 > 嵌套 event.subscribe 解决方案

javascript - 嵌套 event.subscribe 解决方案

问题描述

我正在使用 Angular dragula 拖放，它允许我在视图周围移动引导卡。当您“放下”某个项目时，它会触发 this.dragulaService.drop.subscribe()，在其中我可以在移动完成之前取消或回滚拖动的项目。

我想在那里使用我的模态。看起来像这样：让订阅 = this.modalService.onSubmit.subscribe((val) => {

该模态订阅保持线程等待用户在模态中单击“确定”或“取消”，其中显示“您确定要移动此项目吗？”

问题是，水獭事件订阅（dragula）不等待模式事件订阅完成，dragula 只是在模式确认之前结束，这对我来说是个问题。因为当我尝试调用 drake.cancel 时，它不再存在。

代码 ：

    this.dragulaService.drop.subscribe(
        value => {
        let modal: ModalComponent = this.modalService.GetModal();
        let subscription = this.modalService.onSubmit.subscribe((val) => {
            //Here if user clicks OK, we do nothing and drag-drop finish successfuly
            //If user clicks Cancel, we call this.dragulaService.find('bag-deals').drake.cancel(true);

标签： javascriptangulartypescriptecmascript-6ng2-dragula

解决方案

您可以在管道中使用 concatMap，这是一篇关于高阶 RxJS 映射运算符的有趣文章

我以这种方式在您的情况下使用它：

    let dropValue;
    this.dragulaService.drop
      .pipe(concatMap(value => {
        dropValue = value;
        const modal: ModalComponent = this.modalService.GetModal();
        return this.modalService.onSubmit;
      })).subscribe(value => {
         //Here if user clicks OK, we do nothing and drag-drop finish successfuly
         //If user clicks Cancel, we call this.dragulaService.find('bag-deals').drake.cancel(true);
    });

推荐阅读