Why doesn't DI work?

Question

Angular

There are 2 controllers.

app.controller("adminController", ["$scope", "$modal", "productsService", "ordersService",  function ($scope, $modal, productsService, ordersService) {
        ......
        $scope.openAddProductModal = function (size) {
            var modalInstance = $modal.open({
                templateUrl: '/modal/addproduct',
                controller: 'addProductController',
                size: size
            });
            
            modalInstance.result.then(function (selectedItem) {
                $scope.selected = selectedItem;
            });
        };
    }]);

Modal Window Controller

app.controller('addProductController', ["$scope", "$modalInstance",  "productsService", function ($scope, $modalInstance, productsService) {
    $scope.ok = function () {
        $modalInstance.close();
    };
    
    $scope.cancel = function () {
        $modalInstance.dismiss('cancel');
    };
    
}]);

DI not working, Unknown provider: $modalInstanceProvider <- $modalInstance <- addProductController. Suggest a solution. Thanks to!

Answer 1

Maybe because you declared the view controller twice? Well, that is, /modal/addproductthere is something like in the file
and the controller is indicated in the open method. If so, then try to remove the directive ng-controllerfrom the view