Need to use modal in a modal Angularjs

Question

I am using $uibmodel in my angular app. I need to open a new modal in a one modal. bcoz of that i need to inject '$uibModal' and '$uibModalInstance' both, in one of my controller. that controller looks somewhat like this. '$uibModal' and '$uibModalInstance' in one controller

baseController.$inject = ['$uibModal', '$uibModalInstance'];

function baseController($uibModal, $uibModalInstance) {

self.ok = function () {
$uibModalInstance.close(self.selected.item);
};

self.cancel = function () {
$uibModalInstance.dismiss('cancel');
};

Now the problem is i am getting error in consolle saying

Unknown provider: $uibModalInstanceProvider <- $uibModalInstance

I know this is because of injecting '$uibModal' and '$uibModalInstance' both in one controller, but i have to. Bcoz of that error in console i am not able to close the second modal. tell me if there any way to use'$uibModal' and '$uibModalInstance' both in one controller. I have to keep both of these in one conteroller.

Did you forget to assign controller to second modal instance? Create a plunker demo that reproduces this — charlietfl

Satyaki Satyaki · Accepted Answer · 2016-05-30T12:15:03

Do something like this -

var modalInstance = $uibModal.open({
    animation: true,
    templateUrl: '../Template/dummy.tpl.html',
    controller: function($scope, $uibModalInstance) {
        $scope.Delete = function () {
            alert('Delete')
        };

        $scope.Cancel = function () {
            alert('Cancel')
            $uibModalInstance.dismiss('cancel');
        };
    },
});

This is nothing but just bypassing creating a new controller. If you are using strict di mode, I will suggest you to create a variable and put the controller function there and refer it like this.

......
 controller: dummyController;
......
var dummyController = function($scope, $uibModalInstance){
 .......

}

Need to use modal in a modal Angularjs

1 Answers