Question

继续收到以下错误消息。我无法找到解决问题的过去问题。不知道从哪里开始。

由于以下原因导致无法实例化模块schoolApp：错误：[$ injector：modulerr] http://errors.angularjs.org/1.3.14/ $ injector / modulerr？p0 = ...）在错误（本机）

的index.html：

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

    <title>LS Dashboard</title>

    <!-- CSS -->
    <link href="css/reset.css" rel="stylesheet">
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

</head>


<body>

<header>
    <span id="headerText"><a href="/">Hawaii DOE Dashboard</a></span>

    <a href="http://www.tlcdelivers.com" target="_blank"><img id="tlclogo" src="img/The_Library_Corporation_logo.png"></img></a>
</header>

<div ng-view></div>

    <!-- Scripts -->
    <script src="js/jquery-1.11.2.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
    <script src="//code.angularjs.org/1.2.16/angular.min.js"></script>
    <script src="//code.angularjs.org/1.2.16/angular-route.js"></script>
    <script src="//code.angularjs.org/1.2.16/angular-resource.min.js"></script>
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
</body>
</html>

app.js：

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

app.config(function($routeProvider) {
  $routeProvider.when('/', 
  {
    templateUrl: 'views/home.html',
    controller: 'schoolsCtrl'
  })
  .when('/dashboard',
  {
     templateUrl: 'views/modules.html',
     controller: 'urlCtrl'
  })
  .otherwise({ redirectTo: '/' });
});

controllers.js：

app.controller('urlCtrl', function($scope) {


    $scope.url = 'http://ws8-sptweb';
    $scope.staff = $scope.url + ':8082/LS2Staff';
    $scope.reports = $scope.url + '/ls2reports';

    $scope.pac = $scope.url + ':8080/';
    $scope.kids = $scope.url + ':8080/kids'
    $scope.ysm = 'www.youseemore.com';
    $scope.config = '?config=';

    $scope.pacConfig = null;
    $scope.ysmConfig = null;
    $scope.pacUrl = url + pac + config + pacConfig;
    $scope.ysmUrl = url + ysm + ysmConfig;



    $scope.backroom = $scope.url + ':8096/backroom';
    $scope.rti = $scope.url + '/rti';



    $scope.osc = 'http://ww2.tlcdelivers.com/helpdesk';
    $scope.otc = 'http://otcampus.tlcdelivers.com';
    $scope.lscustomer = 'http://ww2.tlcdelivers.com/lscustomer/';
    $scope.kb = 'http://kb.tlcdelivers.com/';



    $scope.blackboard = 'http://hidoe.blackboard.com';
    $scope.hidoehome = 'http://www.hawaiipublicschools.org/Pages/home.aspx';

});

app.controller('schoolsCtrl', function($scope) {

    $scope.allSchools = [
        {name: 'All Schools', pacConfig: '', ysmConfig:''},
        {name: 'All Elementary Schools', pacConfig: '', ysmConfig:''},
        {name: 'All Middle Schools', pacConfig: '', ysmConfig:''},
        {name: 'All High Schools', pacConfig: '', ysmConfig:''},
        {name: 'All Charter Schools', pacConfig: '', ysmConfig:''},
        {name: 'All Other Schools', pacConfig: '', ysmConfig:''}
        ];
});

modules.html：

<div class="mainContent">

    <div class="row">

        <div id="staff" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{staff}}" class="thumbnail" target="_blank">
              Staff
            </a>
        </div>

        <div id="reports" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{reports}}" class="thumbnail" target="_blank">
                Reports
            </a>
        </div>

        <div id="pac" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{pac}}" class="thumbnail" target="_blank">
                PAC
            </a>
        </div>

        <div id="kids" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{kids}}" class="thumbnail" target="_blank">
                Kids
            </a>
        </div>

        <div id="ysm" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{ysm}}" class="thumbnail" target="_blank">
                YouSeeMore
            </a>
         </div>

        <div id="backroom" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{backroom}}" class="thumbnail" target="_blank">
                Backroom
            </a>
        </div>

        <div id="rti" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{rti}}" class="thumbnail" target="_blank">
                RTI
            </a>
        </div>

        <div id="onlineSupport" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{osc}}" class="thumbnail" target="_blank">
                Support Center
            </a>
        </div>

        <div id="onlineTraining" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{otc}}" class="thumbnail" target="_blank">
                Training Campus
            </a>
        </div>

        <div id="customerSite" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{lscustomer}}" class="thumbnail" target="_blank">
                LS Customer
            </a>
        </div>

        <div id="kb" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{kb}}" class="thumbnail" target="_blank">
                Knowledge Base
            </a>
        </div>

        <div id="blackboard" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{blackboard}}" class="thumbnail" target="_blank">
                Blackboard
            </a>
        </div>

        <div id="website" class="column col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a ng-href="{{hidoehome}}" class="thumbnail" target="_blank">
                HIDOE Home
            </a>
        </div>

    </div>  

</div>

home.html的：

<div id="mainContent">

    <div id="selectSchoolText">
        Please select your school.
    </div>

<div>

    <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"> <!--ng-controller="centralCtrl"-->
        <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" id="" data-toggle="dropdown" aria-expanded="true">
                Central
                <span class="caret"></span>
            </button>
            <ul class="dropdown-menu district-menu" role="menu" aria-labelledby="dropdownMenu1">
                <li role="presentation" ng-repeat="school in centralSchools"><a role="menuitem" tabindex="-1" href="modules.html">{{ school.name }}</a></li>
            </ul>
        </div>
    </div>


    <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"> <!--ng-controller="hawaiiCtrl"-->
        <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" id="" data-toggle="dropdown" aria-expanded="true">
                Hawaii
                <span class="caret"></span>
            </button>
            <ul class="dropdown-menu district-menu" role="menu" aria-labelledby="dropdownMenu1">
                <li role="presentation" ng-repeat="school in hawaiiSchools"><a role="menuitem" tabindex="-1" href="modules.html">{{ school.name }}</a></li>
            </ul>
        </div>  
    </div>


    <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"><!-- ng-controller="honoluluCtrl"-->
        <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" id="" data-toggle="dropdown" aria-expanded="true">
                Honolulu
                <span class="caret"></span>
            </button>

            <ul class="dropdown-menu district-menu" role="menu" aria-labelledby="dropdownMenu1">
                <li role="presentation" ng-repeat="school in honoluluSchools"><a role="menuitem" tabindex="-1" href="modules.html">{{ school.name }}</a></li>
            </ul>
        </div>  
    </div>


    <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"><!--  ng-controller="kauaiCtrl"-->
        <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" id="" data-toggle="dropdown" aria-expanded="true">
                Kauai
                <span class="caret"></span>
            </button>
            <ul class="dropdown-menu district-menu" role="menu" aria-labelledby="dropdownMenu1">
                <li role="presentation" ng-repeat="school in kauaiSchools"><a role="menuitem" tabindex="-1" href="modules.html">{{ school.name }}</a></li>
            </ul>
        </div>      
    </div>


<!--<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>-->


    <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"><!--  ng-controller="leewardCtrl"-->
        <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" id="" data-toggle="dropdown" aria-expanded="true">
                Leeward
                <span class="caret"></span>
            </button>
            <ul class="dropdown-menu district-menu" role="menu" aria-labelledby="dropdownMenu1">
                <li role="presentation" ng-repeat="school in leewardSchools"><a role="menuitem" tabindex="-1" href="modules.html">{{ school.name }}</a></li>
            </ul>
        </div>
    </div>


    <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"><!-- ng-controller="mauiCtrl"-->
        <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" id="" data-toggle="dropdown" aria-expanded="true">
                Maui
                <span class="caret"></span>
            </button>
            <ul class="dropdown-menu district-menu" role="menu" aria-labelledby="dropdownMenu1">
                <li role="presentation" ng-repeat="school in mauiSchools"><a role="menuitem" tabindex="-1" href="modules.html">{{ school.name }}</a></li>
            </ul>
        </div>  
    </div>


    <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"><!-- ng-controller="windwardCtrl"-->
        <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" id="" data-toggle="dropdown" aria-expanded="true">
                Windward
                <span class="caret"></span>
            </button>

            <ul class="dropdown-menu district-menu" role="menu" aria-labelledby="dropdownMenu1">
                <li role="presentation" ng-repeat="school in windwardSchools"><a role="menuitem" tabindex="-1" href="modules.html">{{ school.name }}</a></li>
            </ul>
        </div>  


    </div>


    <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"><!-- ng-controller="allCtrl"-->
        <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" id="" data-toggle="dropdown" aria-expanded="true">
                All Schools
                <span class="caret"></span>
            </button>
            <ul class="dropdown-menu district-menu" role="menu" aria-labelledby="dropdownMenu1">
                <li role="presentation" ng-repeat="school in allSchools"><a role="menuitem" tabindex="-1" href="modules.html">{{ school.name }}</a></li>
            </ul>
        </div>      
    </div>  
</div>

</div>

Answer 1

试试这个，你没有注入$routeProvider：

app.config(['$routeProvider', function($routeProvider) {
  $routeProvider.when('/', 
  {
    templateUrl: 'views/home.html',
    controller: 'schoolsCtrl'
  })
  .when('/dashboard',
  {
     templateUrl: 'views/modules.html',
     controller: 'urlCtrl'
  })
  .otherwise({ redirectTo: '/' });
}]);

Answer 2

将您的控制器更新为：

app.controller('schoolsCtrl',['$scope', function($scope) { ... }]);

app.controller('urlCtrl', ['$scope', function($scope) { ...}]);

错误：$ injector：modulerr模块错误......为什么我得到这个？

2 个答案: