Base solution for your next web application
Open Closed

[$injector:unpr] issue #862


User avatar
0
joe704la created

I am very new to Angular.js. I keep getting the below error and I cannot figure out why. I understand it has to do with me injecting the $modal but It looks no different than any of the documentation I was going off of. Below the error is the js code.

Error: [$injector:unpr] http://errors.angularjs.org/1.5.0/$injector/unpr?p0=%24modalProvider%20%3C-%20%24modal%20%3C-%20tenant.views.projects.index
    at Error (native)
    at http://localhost:6240/Scripts/angular.min.js:6:416
    at http://localhost:6240/Scripts/angular.min.js:43:7
    at Object.d [as get] (http://localhost:6240/Scripts/angular.min.js:40:270)
    at http://localhost:6240/Scripts/angular.min.js:43:69
    at d (http://localhost:6240/Scripts/angular.min.js:40:270)
    at e (http://localhost:6240/Scripts/angular.min.js:41:1)
    at Object.invoke (http://localhost:6240/Scripts/angular.min.js:41:86)
    at T.instance (http://localhost:6240/Scripts/angular.min.js:86:444)
    at u (http://localhost:6240/Scripts/angular.min.js:65:338) <div ui-view="" class="fade-in-up ng-scope">
(function () {
    appModule.controller('tenant.views.projects.index', [
        '$scope', '$modal', 'abp.services.app.project',
        function ($scope, $modal, projectService) {
            var vm = this;

            vm.projects = [];

            vm.getProjects = function() {
                projectService.getProjects({}).success(function (result) {
                    vm.projects = result.items;
                });
            }

            vm.openCreateProjectModal = function () {
                var modalInstance = $modal.open({
                    templateUrl: '~/App/tenant/views/projects/createProjectModal.cshtml',
                    controller: 'tenant.views.projects.createProjectsModal as vm',
                    backdrop: 'static'
                });

                modalInstance.result.then(function () {
                    getProjects();
                });
            };

            vm.getProjects();
        }
    ]);
})();

6 Answer(s)
  • User Avatar
    0
    paddyfink created

    Hi,

    Check if you create your interface IProjectAppService and that it derived from IApplicationService

  • User Avatar
    0
    joe704la created

    Yes it does. The project service works just fine. When I remove $modal it works just fine. For example this works just fine. It has something to do with $modal.

    (function () {
        appModule.controller('tenant.views.projects.index', [
            '$scope', 'abp.services.app.project',
            function ($scope,  projectService) {
                var vm = this;
    
                vm.projects = [];
    
                vm.getProjects = function() {
                    projectService.getProjects({}).success(function (result) {
                        vm.projects = result.items;
                    });
                }
    
    
                vm.getProjects();
            }
        ]);
    })();
    
  • User Avatar
    0
    paddyfink created

    Try with $uibModal instead of $modal

  • User Avatar
    0
    joe704la created

    Perfect that worked, this may be a stupid question but what is the difference between $uibModal and $modal

    I had to do the same thing for $uibModalInstance to make it work.

  • User Avatar
    0
    paddyfink created

    $modal has been replaced in the latest vesion of angular bootstrap.

    You can check the documentation here : <a class="postlink" href="https://angular-ui.github.io/bootstrap/">https://angular-ui.github.io/bootstrap/</a>

  • User Avatar
    0
    joe704la created

    Oh yes I see that now. Thank you.