0

angular ブートストラップを使用しようとすると、インジェクター エラーが発生します。エラーは次のとおりです。

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 に答える