CODEWITHSUNDEEP
angularjsbootstrap-modal
ALFA
ALFA

Reputation: 285

Error injector $uiBModalInstance

Is it possible to open and close a Modal in one controller??. Here is my code:

ListRoleApp.controller('ListRoleController', function ($scope, $uibModal, $uibModalInstance) {

    $scope.openConfirmModal = function () {
        var modalInstance = $uibModal.open({
            animation: true,
            templateUrl: '../Template/ConfirmForm.tpl.html',
            controller: 'ListRoleController',
        });

    };

    $scope.Delete = function () {
        alert('Delete')
    };

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

})

I tried and came across the below error. enter image description here

Thank you

Upvotes: 1

Views: 8498

Answers (1)

xtof
xtof

Reputation: 106

Yeah, that's possible..

If you have strict-di mode disabled on your AngularJS app you can do it like this:

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

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

If strict-di mode is enabled just define your controller in a separate variable in your ListRoleController and inject the $scope and $uibModalInstance:

var modalController = function ($scope, $uibModalInstance) {
    $scope.yes = function() {
        $uibModalInstance.close();
    };

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

modalController.$inject = ['$scope', '$uibModalInstance'];

var modalInstance = $uibModal.open({
    animation: true,
    templateUrl: '../Template/ConfirmForm.tpl.html',
    controller: modalController,
});

Upvotes: 3

Related Questions