beawolf beawolf - 2 months ago 29
AngularJS Question

Disabling Animation For Angular UI Bootstrap Modals Completely

I'm using Angular UI Bootstrap Modal component, and I can disable animation for a modal like this:

var modalInstance = $uibModal.open({
animation: false,
component: 'myComponent'
});


Is there any way to disable animation completely on all modals in my application without css addition/modification?

Answer

$uibModal object has a provider named $uibModalProvider, and it is possible to use it in configuration phase to set default values for $uibModal.

Something like this will work:

angular
    .module('myApp')
    .config(['$uibModalProvider', function ($uibModalProvider) {
        $uibModalProvider.options.animation = false;
    }]);

It is also possible to provide default values for other options all at once as well:

angular
    .module('myApp')
    .config(['$uibModalProvider', function ($uibModalProvider) {
        $uibModalProvider.options = {
            animation: false,
            backdrop: false,
            keyboard: false
        };
    }]);