如何使用角带式模态的onHide选项

Question

我使用角带和模态服务.我在使用参数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);

但当我关闭我的模态时没有任何反应,我在控制台中看不到任何日志(关闭或打开).提前感谢任何能够给我一些想法的人!

Answer 1

经过一番调查后发现这是一个有趣的案例.

看起来$modal在分布式版本中不同步!我的意思是当凉亭或npm取出角带时.

1. 看看你自己的本地版本的角度带,甚至在最新版本2.3.8中你都可以找到对onShowor的引用onHide

2. 看一下github repo上的源代码 - > https://github.com/mgcrea/angular-strap/blob/master/src/modal/modal.js

在这里onShow,onHide实际上被解雇了!因此,似乎模态与分布式版本中的其他角度带不同步.

它不是错误的文档(我实际上相信很长一段时间),但我们下载的源代码不是最新的!

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

根据我的经验,使用onShowetc选项是没用的.我在modal.show/ modal.hideevents 上使用处理程序,它总是被广播.如果你有一个多模态环境(模态超过模态),"标记"模态以避免混淆.

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
  }
})