0

当我尝试使用 angular bootstrap 时出现注入器错误。这是错误:

angular.js:13424 Error: [$injector:unpr] http://errors.angularjs.org/1.5.3/$injector/unpr?p0=ui.bootstrapProvider%20%3C-%20ui.bootstrap%20%3C-%20AdminController
at Error (native)
at http://localhost:3000/node_modules/angular/angular.min.js:6:416
at http://localhost:3000/node_modules/angular/angular.min.js:43:7
at Object.d [as get] (http://localhost:3000/node_modules/angular/angular.min.js:40:270)
at http://localhost:3000/node_modules/angular/angular.min.js:43:69
at d (http://localhost:3000/node_modules/angular/angular.min.js:40:270)
at e (http://localhost:3000/node_modules/angular/angular.min.js:41:1)
at Object.instantiate (http://localhost:3000/node_modules/angular/angular.min.js:41:364)
at http://localhost:3000/node_modules/angular/angular.min.js:88:341
at http://localhost:3000/node_modules/angular-ui-router/release/angular-ui-router.min.js:7:23742 <div class="template ng-scope" ui-view="">

这是我的 index.html:

<!DOCTYPE html>
<html lang="en" ng-app="FriendZone">
<head>
<meta charset="UTF-8">
<title>Hello</title>
<link rel="stylesheet"       href="node_modules/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="node_modules/angular-ui-bootstrap/dist/ui-bootstrap-csp.css">
<link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="public/stylesheets/style.css">
</head>
<body>
<div class="template" ui-view></div>

<script src="node_modules/jquery/dist/jquery.min.js"></script>
<script src="node_modules/angular/angular.min.js"></script>
<script src="node_modules/angular-bootstrap/ui-bootstrap-tpls.min.js">    </script>
<script src="node_modules/angular-ui-router/release/angular-ui-router.min.js"></script>

<script src="front/app.js"></script>
<script src="front/navigation/navigation-controller.js"></script>
<script src="front/landing/landing-controller.js"></script>
<script src="front/search/search-controller.js"></script>
<script src="front/profile/profile-controller.js"></script>
<script src="front/admin/admin-controller.js"></script>
</body>
</html>

这是我的管理员控制器:

    (function () {
angular.module('FriendZone').controller('AdminController', ['$scope', '$state', '$http', 'ui.bootstrap',
    function ($scope, $state, $http, $view) {
        $scope.getUsers = function() {

        };

        $scope.getUsers();
    }]);

我对 Angular 还是很陌生,所以它可能非常简单。先感谢您!

编辑:路由代码(app.js):

    angular.module('FriendZone', ['ui.router', 'ui.bootstrap'])
    .config(function($stateProvider, $urlRouterProvider){
        $urlRouterProvider.otherwise('/landing');
        console.log("hello");
        $stateProvider.state('landing', {
            url: '/landing',
            templateUrl: 'front/landing/landing.html',
            controller: 'LandingController'
        }).state('search', {
            url: '/search',
            templateUrl: 'front/search/search.html',
            controller: 'SearchController'
        }).state('profile', {
            url: '/profile',
            templateUrl: 'front/profile/profile.html',
            controller: 'ProfileController'
        }).state('admin', {
            url: '/admin',
            templateUrl: 'front/admin/admin.html',
            controller: 'AdminController'
        });
    });
4

2 回答 2

1

在模块初始化中注入ui.bootstrap模块依赖项,而不是在控制器中。检查控制器中的依赖注入。

      angular.module('FriendZone',['ui.bootstrap']).controller('AdminController', ['$scope', '$state', '$http',
        function ($scope, $state, $http) {
         $scope.getUsers = function() {

        };

       $scope.getUsers();
}]); 
于 2016-03-30T15:48:25.647 回答
0

您需要在模块级别包含依赖项,该依赖项通常在 app.js 文件中定义。控制器使用依赖项中定义的代码,这些代码在您在模块定​​义中初始化模块时注入。然后在您已链接的单独文件中,调用模块定义,它会提取您已经定义的所有依赖项。

于 2016-03-30T15:53:18.827 回答