angular.js:4640Uncaught错误:[$ injector:modulerr]得到这个错误

问题描述:

上述错误我得到当我运行angularjs路由简单的应用程序。 我为分模板制作了单独的文件夹。只有三个文件包含简单的标题。

下面代码route.html

<!DOCTYPE html> 
<html ng-app="myApp"> 
<head> 
    <title>Angular Js Route Example</title> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <link href="css/external/reset.css" rel="stylesheet" type="text/css"/> 
    <link href="css/route.css" rel="stylesheet" type="text/css"/> 

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-route.min.js"></script> 
    <script src="js/route.js" type="text/javascript"></script> 
</head> 
<body> 
    <div class="outerWraper"> 
     <div class="header"> 
      <h2>Website Header</h2> 
     </div> 

     <div class="mainContainer"> 
      <div class="leftContainer"> 
       <ul class="leftMenuBar"> 
        <li><a href="#/home">Home</a></li> 
        <li><a href="#/courses">Courses</a></li> 
        <li><a href="#/students">Students</a></li> 
       </ul> 
      </div> 

      <div class="rightContainer"> 
       <div class="eachContentDiv"> 
        <ng-view> </ng-view> 
       </div> 
      </div> 
     </div> 

     <div class="footerWraper"> 
      <h5>Website footer</h5> 
     </div> 
    </div> 
</body> 

函授教育JS文件。

var myApp = angular 
    .module('myApp', ["ngRoute"]) 
    .config(function ($routeProvider){ 
     $routeProvider 
      .when("/home", { 
       templateUrl: "partial_route_templates/home.html", 
       controller: "homeController" 
      }) 
      .when("/courses", { 
       templateUrl: "partial_route_templates/courses.html", 
       controller: "coursesController" 
      }) 
      .when("/students", { 
       templateUrl: "partial_route_templates/student.html", 
       controller: "studentController" 
      }) 

      .controller('homeController', function ($scope){ 
       $scope.message = "Home Page"; 
      }) 

      .controller('coursesController', function ($scope){ 
       $scope.message = "courses Page"; 
      }) 

      .controller('studentController', function ($scope){ 
       $scope.message = "student Page"; 
      }) 
    }); 
+0

您的route.html页面似乎缺少对您的correspondence.js文件的引用。 –

+0

对应的js表示它的route.js。 – user993164

+0

我明白了。我编辑了这篇文章,使其更清晰。在您的浏览器控制台中,您可以验证route.js文件在那里吗? –

您的route.js文件被打碎。我会提供更正的代码,但是如果您已经研究了这个错误,那么您会看到错误非常明显 - $routeProvider没有功能controller。您将控制器定义链接到$routeProvider而不是angular对象。

var myApp = angular 
    .module('myApp', ["ngRoute"]) 
    .config(function ($routeProvider){ 
     $routeProvider 
      .when("/home", { 
       templateUrl: "partial_route_templates/home.html", 
       controller: "homeController" 
      }) 
      .when("/courses", { 
       templateUrl: "partial_route_templates/courses.html", 
       controller: "coursesController" 
      }) 
      .when("/students", { 
       templateUrl: "partial_route_templates/student.html", 
       controller: "studentController" 
      }); 
    }) 

    .controller('homeController', function ($scope){ 
     $scope.message = "Home Page"; 
    }) 

    .controller('coursesController', function ($scope){ 
     $scope.message = "courses Page"; 
    }) 

    .controller('studentController', function ($scope){ 
     $scope.message = "student Page"; 
    }); 
+0

在删除路由js文件中的控制器功能后正常工作。 – user993164