如何使用 angular-strap 模态的 onHide 选项答案

【问题标题】：How to use the onHide option of angular-strap's modal如何使用 angular-strap 模态的 onHide 选项
【发布时间】：2016-09-24 16:19:30
【问题描述】：

我使用 angular-strap 和模态服务。我尝试在使用参数 onHide 关闭模式时调用一个函数。

var _modal = $modal({
            templateUrl: "app/pages/fee/modals/historic/fee.historic.html",
            controller: "HistoricController",
            controllerAs: "vm",
            keyboard: true,
            show: false,
            onHide: function() {
                console.log("Close !");
            },
            onShow: function() {
                console.log("Open !");
            }
        });
_modal.$promise.then(_modal.show);

但是当我关闭我的模式时，什么也没有发生，我在控制台中看不到我的任何日志（关闭或打开）。提前感谢任何可以给我一些想法的人！

【问题讨论】：

您所包含的代码似乎没有任何问题。您能否提供更多代码来显示您的控制器配置。在 JSFiddle 中复制它也会有所帮助。

标签： javascript angularjs angular-strap

【解决方案1】：

经过一番调查，结果证明这是一个有趣的案例。

似乎$modal 在分布式版本中不同步！我的意思是当 Bower 或 npm 获取 angular-strap 时。

查看您自己的本地版本的 angular-strap，即使在最新版本 2.3.8 中您也找不到对 onShow 或 onHide 的引用
看看github repo上的源码->https://github.com/mgcrea/angular-strap/blob/master/src/modal/modal.js

这里onShow 和onHide 实际上被解雇了！因此，模态似乎与分布式版本中的其他角带不同步。

错误的不是文档（我其实很早就相信了），而是我们下载的源不是最新的！

因此，如果您想要支持onShow 等，您必须将来自 github 存储库的最新 /modal 合并到您的本地 angular-strap 中。就我个人而言，我不会这样做，因为它会在升级等时引起各种问题 - 我坚持我原来的答案，但现在至少我知道为什么我必须这样做。

根据我的经验，onShow 等选项的使用是无用的。我在 modal.show / modal.hide 事件上使用处理程序，这些事件总是被广播的。如果您有一个多模态环境（模态而不是模态），请“标记”模态以避免混淆。

var _modal = $modal({
  templateUrl: "app/pages/fee/modals/historic/fee.historic.html",
  controller: "HistoricController",
  controllerAs: "vm",
  keyboard: true,
  show: false,
  tag: 'myModal'
}

$scope.$on('modal.show', function(e, target) {
  if (target.$options.tag == 'myModal') {
    //do stuff here
  }
})
$scope.$on('modal.hide', function(e, target) {
  if (target.$options.tag == 'myModal') {
    //do stuff here
  }
})

【讨论】：