角度ngRoute注入误差

时间:2016-09-30 08:39:22

标签: angularjs

为什么此代码显示角度注入错误,有人可以帮助我吗?这是错误,请有人看看这个。它显示ngRoute错误。我一直认真对待这个问题。

angular.js:38 Uncaught Error: to[$injector:modulerr] http://errors.angularjs.org/1.4.12/$injector/modulerr?p0=cbApp&p1=Error%3A%…t%3A63342%2FcbApp%2Fbower_components%2Fangular%2Fangular.min.js%3A19%3A463)

var cbApp = angular.module('cbApp', ['ngRoute']);

    cbApp.config(function(ngRoute, $httpProvider, $routeProvider) {

      $httpProvider.interceptors.push('TokenInterceptor');

      $routeProvider
          .when('/', {
            templateUrl: 'partials/login.html',
            controller: 'loginCtrl'
          })
          .when('/', {
            templateUrl: 'partials/dashboard.html',
            controller: 'dashboardCtrl'
          })
          .when('/', {
            templateUrl: 'partials/newPreAuth.html',
            controller: 'newPreAuthCtrl'
          })
          .when('/', {
            templateUrl: 'partials/submitted.html',
            controller: 'submittedCtrl'
          })
          .otherwise({redirectTo:'/'});
    });
    cbApp.run(function($rootScope, $window, $location, AuthenticationFactory) {
      // when the page refreshes, check if the user is already logged in
      userAuthorizationToken.check();

      $rootScope.$on("$routeChangeStart", function(event, nextRoute, currentRoute) {
        if ((nextRoute.access && nextRoute.access.requiredLogin) && !AuthenticationFactory.isLogged) {
          $location.path("/login");
        } else {
          // check if user object exists else fetch it. This is incase of a page refresh
          if (!userAuthorizationToken.user) AuthenticationFactory.user = $window.sessionStorage.user;
          if (!userAuthorizationToken.userRole) userAuthorizationToken.userRole = $window.sessionStorage.userRole;
        }
      });

      $rootScope.$on('$routeChangeSuccess', function(event, nextRoute, currentRoute) {
        $rootScope.showMenu = userAuthorizationToken.isLogged;
        $rootScope.role = userAuthorizationToken.userRole;
        // if the user is already logged in, take him to the home page
        if (userAuthorizationToken.isLogged == true && $location.path() == '/login') {
          $location.path('/');
        }
      });
    });

HTML

<!DOCTYPE html>
<html lang="en" ng-app="cbApp">
<head>

  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, shrink-to-fit=no">
  <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
  <title>Claim-Book</title>

  <!-- Bootstrap -->
  <link href="https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i" rel="stylesheet">
  <link href="assets/css/bootstrap.min.css" rel="stylesheet">
  <link href="assets/css/helpers.css" rel="stylesheet">
  <link href="assets/css/verticaltab.css" rel="stylesheet">
  <link href="assets/css/custom.css" rel="stylesheet">

  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>

  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
</head>
<body ng-controller="mainController">
<div id="header-wrapper" class="fixed t-0">
  <header>
    <div class="container-fluid">
      <div class="row">
        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
          <img src="assets/images/aj.jpg" class="img-responsive">
        </div>
        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
          <img src="assets/images/cblogo.png" class="img-responsive pull-right">
        </div>
      </div>
    </div>
  </header>
  <nav class="navbar navbar-default">
    <div class="navbar-header">
      <button aria-controls="navbar" aria-expanded="false" data-target="#navbar" data-toggle="collapse" class="navbar-toggle collapsed" type="button">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
    </div>
    <div class="navbar-collapse collapse" id="navbar">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">Pre-Authorisation</a></li>
        <li><a href="#">Claims</a></li>
        <li><a href="#">Reports</a></li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#"><span class="glyphicon glyphicon-envelope" aria-hidden="true"></span></a></li>
        <li><a href="#"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></a></li>
        <li><a href="#" ng-click="logout()"><span class="glyphicon glyphicon-off" aria-hidden="true"></span></a></li>
      </ul>

      <p class="navbar-text navbar-right" ng-if="currentUser">Welcome, <span>{{ currentUser.username }}</span></p>
    </div>
  </nav>
</div>
<div class="container">
  <ui-view>
</div>
<script type="text/javascript" src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/angular-ui-router.min.js"></script>
<script src="bower_components/ui-bootstrap-tpls-0.11.2.min.js"></script>
<script src="js/app.js"></script>
<script src="bower_components/angular-local-storage/dist/angular-local-storage.js"></script>
<script src="js/mainController.js"></script>


<!--SERVICES -->
<script src="js/auth/auth.controller.js"></script>
<script src="js/auth/auth.factory.js"></script>
<script src="js/directives.js"></script>
<script src="js/factory.js"></script>
<script src="js/filters.js"></script>
<footer class="footer">
  <div class="container-fluid">
    <p class="text-muted text-center">&copy; 2016. Claim-Book. Powered by HealthClaim Technologies Pvt Ltd</p>
  </div>
</footer>

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="assets/js/jquery.icheck.js"></script>
<script type="text/javascript">
  $(function () {
    $("input").iCheck({
      checkboxClass: 'icheckbox_square-blue',
      increaseArea: '20%' // optional
    });
    $(".dark input").iCheck({
      checkboxClass: 'icheckbox_polaris',
      increaseArea: '20%' // optional
    });
    $(".form-control").focus(function () {
      $(this).closest(".textbox-wrap").addClass("focused");
    }).blur(function () {
      $(this).closest(".textbox-wrap").removeClass("focused");
    });
  });
</script>
<script>$("#mimodal").on('hidden.bs.modal', function () {
  $(this).data('bs.modal', null);
});</script>


<script>
  $(document).ready(function() {
    $("div.bhoechie-tab-menu>div.list-group>a").click(function(e) {
      e.preventDefault();
      $(this).siblings('a.active').removeClass("active");
      $(this).addClass("active");
      var index = $(this).index();
      $("div.bhoechie-tab>div.bhoechie-tab-content").removeClass("active");
      $("div.bhoechie-tab>div.bhoechie-tab-content").eq(index).addClass("active");
    });
  });
</script>
</body>
</html>

更新代码

<script type="text/javascript" src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/angular-route/angular-route.min.js"></script>
<script src="bower_components/ui-bootstrap-tpls-0.11.2.min.js"></script>
<script src="js/app.js"></script>
<script src="bower_components/angular-local-storage/dist/angular-local-storage.js"></script>
<script src="js/mainController.js"></script>

1 个答案:

答案 0 :(得分:0)

从注入的参数中删除ngRoute,它已被定义为模块依赖项,如果您正在缩小代码,请尝试以下操作:

cbApp.config(['$httpProvider', '$routeProvider', function($httpProvider, $routeProvider) 
...
]);