Modal似乎有不正确的范围，每次点击都会显示一个额外的时间

Question

当我创建一个模态时，使用从服务器获取的动态消息（不确定这是否相关），模式随消息打开。但是，如果我再次失败并再次创建模态，它将显示两个模态，如果我再次失败，它将显示三个不同的模态，我必须用“关闭”按钮关闭。

我的想法是，这是一些与范围相关的问题，我以某种方式搞砸了，但我无法弄清楚如何解决它，或者$ modalInstance.dismiss（）不能正常工作。

我正在使用angular-ui来访问$ modal。

我创建了一个ModalsFactory，只要我想创建一个模态就会调用它。正如你所看到的，我有一个openModal函数，它包含模态代码和其他三个调用它的函数，具体取决于要显示的模态：

angular.module('tsModule')
    .factory('ModalsFactory',
    function ($modal) {
        return {
            openModal: function(template, message) {
                console.log("OPENING");
                $modal.open({
                    templateUrl: template,
                    controller: function($scope, $modalInstance) {
                        $scope.message = message;
                        $scope.cancel = function () {
                            $modalInstance.dismiss();
                        };
                    },
                    size: 'm'
                });
            },
            openSuccessModal: function(message) {
                this.openModal('/static/partials/modals/modal_success.html', message);
            },

            openFailedModal: function(message) {
                this.openModal('/static/partials/modals/modal_failed.html', message);
            },

            openInfoModal: function(message) {
                this.openModal('/static/partials/modals/modal_info.html', message);
            }
        };
    }
);

这可以通过$ broadcast打开：

$rootScope.$on(AUTH_EVENTS.loginFailed, function(e, res) {
    console.log("LOGIN FAILED");
    ModalsFactory.openFailedModal(res.message);
});

如果服务器通过某种方式返回错误代码，则可以触发此$ broadcast：

console.log("CALLING $BROADCAST");
data.message = "Felaktiga inloggningsuppgifter.";
$rootScope.$broadcast(AUTH_EVENTS.loginFailed, data);

到目前为止我发现的是：OPENING-console文本将显示多次显示的模态数LOGIN FAILED控制台文本将显示为显示的模态数多次.CALLING $ BROADCAST-控制台文本只会显示一次

我找到了一个与我完全相同但没有使用Angular here的人

Answer 1

每次广播模态生成事件时，您都在创建一个新模态。 $ modalInstance.dismiss（）应该只隐藏模态而不是删除/销毁模态。我认为你需要使用$ modalInstance.close（$ scope.selected.item）而不是dismiss。