Javascript 如何使用Factory关闭mouseleave上的角度ui引导uibModal？

我最近将应用程序中的所有modals指令都切换到AngularUI引导modals。但更好的是，遇到了一种新的模式，它在鼠标移动时关闭，而不是单击取消

this.leaveTag = (tag) => {
    TagHover.off();
};

this.hoverTag = (tag) => {
    TagHover.display();
};

上面是调用TagHover工厂内部函数的视图逻辑

下面是工厂，TagHover.display与我们的其他modals一样工作正常，但我尝试使用

leaveTag>TagHover.off

调用modal.close。到目前为止还没有工作

我的问题是，如何调用TagHoverController中的关闭功能，或者如何从我的tagsPanel组件->TagsHover工厂调用$uibModal上的

close

？（不使用$scope或$rootScope事件）

我不是试图从TagHover Ctrl范围内调用

close/cancel

，而是试图从父范围调用

close

const TagHover = angular.module('tickertags-shared')
    .controller('TagHoverController', TagHoverController)
    .factory('TagHover', factory);

TagHoverController.$inject = [
    'TagHover'];

function TagHoverController(
    TagHover) {

    this.$onInit = () => {
        console.log('TagHover onInit')
    };

    this.cancel = () => this.$close();
}

factory.$inject = ['$uibModal'];

function factory($uibModal) {

    const display = () => {
        const modal = $uibModal.open({
            controllerAs: 'tghov',
            bindToController:true,
            templateUrl: 'tags/tag_hover.html',
            windowClass: 'dash-modal',
            resolve: {},
            controller: 'TagHoverController'
        });
    };

    const off = () => {
        $uibModal.close({});
    };

    return {
        display,
        off
    }
}

module.exports = TagHover;

这是文件

open方法返回一个模态实例，即具有以下属性的对象：

关闭（结果）（类型：函数）-可用于关闭模式，传递结果

我还注销了

$uibModal

对象，只看到一个打开的函数，没有关闭：(

---

这是错误的方法-你不能“只关闭模式”，因为你不知道要关闭哪个模式。我建议你重新设计这个

---

您可以查看一下

$uibModalStack

-它存储打开的模态，并具有类似于

disisall

的方法。在您的情况下，您的工厂使用动态模态。因此，您可以通过以下两种方式使用

$uibModalStack

$uibModalStack.dismissAll（）；//关闭所有打开的模式

$uibModalStack.disclose（openedModal.key）；//按键解除模态

排除方法的示例。 由于路由器的动态模式，所以在路由器更改过程中忽略该模式非常重要

一般来说，

$uibModal

将有助于打开模态，如果要关闭模态内部的模态，则每个模态都是

$uibModalInstance

开幕式 从实例关闭。

modalInstance

-模态实例。这与使用控制器时发现的$uibModalInstance injectable相同

WIKI参考：

我在AngularJS$uiModal中使用close（）方法和$uibModal，并使用open（）方法进行管理

开放式方法

vm.lanzarPopShowTask = lanzarPopShowTask;
function lanzarPopShowTask(index){
    vm.modalInstance = $uibModal.open({
        animation: true,
        ariaLabelledBy: 'modal-title-top',
        ariaDescribedBy: 'modal-body-top',
        templateUrl: '/btask/index/task.html',
        size: 'm',
        controller: function ($scope) {
            vm.task = vm.tasks[index];
            vm.index = index;
        },
        scope: $scope
    });
}

封闭法

vm.modalInstance.close();

---

在执行此操作时，我将模式设置为范围变量，然后使用

$scope.sweetmodel.close（）

或

$scope.sweetmodel.disclose（）

您只需记住，如果要执行以下操作，它将不起作用：

$scope.openModal = function () {
    $scope.sweetModal = $uibModal.open({
        templateUrl: '/modals/sweetModal.html',
        size: 'md',
        scope: $scope,
        backdrop: true
    })
        .result.then($scope.modalCloseFunction, $scope.modalDismissFunction);
};

其中，由于变量的设置方式，以下各项适用：

$scope.openModal = function () {
    $scope.sweetModal = $uibModal.open({
        templateUrl: '/modals/sweetModal.html',
        size: 'md',
        scope: $scope,
        backdrop: true
    });

    $scope.sweetModal.result.then($scope.modalCloseFunction, $scope.modalDismissFunction);
};

---

使用$uibModalInstance.close（）而不是$uibModal.close（）嗯，我刚刚尝试过…我注入了

$uibModalInstance

，但得到了未知的提供程序：（很好！这是有效的，我在

$uibModalStack

上没有看到任何文档，但是，你有链接吗？这可能是解决方案，我在这里找到了更多信息：谢谢，但我不是试图从模式关闭，而是从设置它的工厂关闭。我可以直接调用此。如果我在模式的范围内，请取消。明白了。你需要使用$uibModalStack。）用详细的例子展示它的工厂实际上我现在需要重新审视这个…我必须能够针对打开的特定模式，而不是所有模式。在你的例子中，

还款百分比是从哪里来的？你能用我的
函数工厂（$uibModal）发布另一个代码示例吗
上面的示例？我正在试图找出如何设置模式键，以及如何通过它的
openedModal.key来调用某个对象。key
添加了
$uibModalStack.dismise的示例
vm.modalInstance.close();

$scope.openModal = function () {
    $scope.sweetModal = $uibModal.open({
        templateUrl: '/modals/sweetModal.html',
        size: 'md',
        scope: $scope,
        backdrop: true
    })
        .result.then($scope.modalCloseFunction, $scope.modalDismissFunction);
};

$scope.openModal = function () {
    $scope.sweetModal = $uibModal.open({
        templateUrl: '/modals/sweetModal.html',
        size: 'md',
        scope: $scope,
        backdrop: true
    });

    $scope.sweetModal.result.then($scope.modalCloseFunction, $scope.modalDismissFunction);
};