背景:'static' 不适用于 ngDialog 模态

backdrop: 'static' is not working for ngDialog modal

我想防止在外部单击或在键盘中按 esc 时关闭模式。所以我使用 backdrop:'static'keyboard:false 如下所示,

    var app = angular.module('MyApp', ['ngDialog', 'chatSocket']);

    app.controller('MainCtrl', function ($scope, ngDialog) {
    $scope.openChatBox = function() {
      ngDialog.openConfirm({
        template: 'chatBox.html',
        controller: 'msgController',
        backdrop: 'static',
        keyboard: false,
        scope: $scope //Pass the scope object if you need to access in the template
    }).then(
        function(value) {
            //You need to implement the saveForm() method which should return a promise object
            $scope.closeChat().then(

            );
        },
        function(value) {
            //Cancel or do nothing
        }
    );
};

});

点击打开模式的按钮是,

 <button ng-click="openChatBox()" >Open</button>

我的代码有什么问题,为什么不起作用?

你应该在你的模式上使用 backdrop: 'static' 打开它,同时 $uibModal.open():

$uibModal.open({
    template: 'chatBox.html',
    controller: 'msgController',
    backdrop: 'static', // <--
    ...
});

看看AngularUI modal docs

ngDialog 似乎不支持静态背景。所以最好使用 $model.open

$scope.openChatBox = function() {
    var modalInstance = $modal.open({
                    template: 'chatBox.html',
                    controller: 'msgController',
                    backdrop: 'static',
                    keyboard: false,
                    scope: $scope
                });
                modalInstance.result.then(function () {
                    function(value) {
                       // do something
                   },
                   function(value) {
                      //Cancel or do nothing
                   }
                });
}

对于$modal,我们使用backdropkeyboard选项来实现,但是对于ngDialog,选项是closeByDocumentcloseByEscape ].

$scope.openChatBox = function() {
    ngDialog.openConfirm({
        template: 'chatBox.html',
        controller: 'msgController',
        closeByDocument: false,
        closeByEscape: false,
        scope: $scope //Pass the scope object if you need to access in the template
    }).then(
        function(value) {
            //You need to implement the saveForm() method which should return a promise object
            $scope.closeChat().then(

            );
        },
        function(value) {
            //Cancel or do nothing
        }
    );
};

使用 closeByDocument: false,而不是背景来防止页面在背景点击时关闭。

    template: 'chatBox.html',
    controller: 'msgController',
    closeByDocument: false,
    keyboard: false,