2016-04-29 105 views
1

伙计们。找不到为什么ngRoute没有加载:模块'ngRoute'不可用

我知道这个错误很旧,我已经找到了很多有关这个问题的答案,但是我仍然找不到修复程序。

我真的得到以下错误消息:

angular.js:68未被捕获的错误:[$注射器:modulerr]未能实例模块对myApp由于: 错误:无法:[$注射器modulerr]实例化模块ngRoute由于: 错误:[$ injector:nomod]模块'ngRoute'不可用!您拼错了模块名称或忘记加载模块名称。如果注册模块确保您指定依赖关系作为第二个参数。

的Index.html

<!DOCTYPE html> 

<html lang="en" ng-app="myApp" > 
    <head> 
     <meta charset="utf-8"> 
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.js"></script> 
     <script type="text/javascript" scr="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-route.js"></script> 
     <script type="text/javascript" src="js/app.js"></script> 
     <title>My test Website</title> 
     <meta name="author" content="me"> 
    </head> 

    <body ng-controller="ContentController"> 
     <ul class="main-nav" id="main-nav"> 
      <li><a href="#/"><i class="fa fa-home"></i>Home</li> 
      <li><a href="#nothing"><i class="fa fa-comment"></i>Portfolio</li> 
      <li><a href="#nothing"><i class="fa fa-comment"></i>Articles</li> 
      <li><a href="#nothing"><i class="fa fa-comment"></i>Books</li> 
     <li><a href="#about"><i class="fa fa-shield"></i>About Me</li> 
     </ul> 
     <p>Nothing here {{ 1 + 2}}</p> 

     <ng-view></ng-view> 
    </body> 


</html> 

App.js

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


    websiteApp.config( function($routeProvider) { 
    $routeProvider 
     .when('/main', { 
      templateUrl: '/views/main.html', 
      controller: 'MainController' 
     }) 
     .when('/about', { 
      templateUrl: '/views/about.html', 
      controller: 'AboutController' 
     }) 
     .otherwise({ 
      redirectTo: '/' 
     }); 
    }); 

    websiteApp.controller('ContentController', function ($scope) { 
     console.log("content controller loaded"); 
    }); 

    websiteApp.controller('MainController', function ($scope) { 
     console.log("main loaded"); 
    }); 

    websiteApp.controller('AboutController', function ($scope) { 
     console.log("about loaded"); 
    }); 

我知道我可能会丢失一个非常简单的细节,但我有双重检查相关问题的所有答案在堆栈溢出和我不知道如何解决这个问题。

我相信准备小提琴不会帮助你,因为这个问题似乎与角度路线的参考有关。

此外,我已经在浏览器上禁用缓存。

你能帮我吗?

谢谢!

回答

2

你在这行

<script type="text/javascript" scr="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-route.js"></script> 

有拼写错误不应该BR SCRSRC

0

你也应该更新脚本标签

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-route.js"></script> 

,在中有更好的推荐方法来声明您的配置文件。此技术可确保您的代码与Angular的指导方针保持一致。

websiteApp.config(['$routeProvider', '$httpProvider', function($routeProvider, $httpProvider) { 
    $routeProvider 
     .when('/main', { 
      templateUrl: '/views/main.html', 
      controller: 'MainController' 
     }) 
     .when('/about', { 
      templateUrl: '/views/about.html', 
      controller: 'AboutController' 
     }]) 
     .otherwise({ 
      redirectTo: '/' 
     }); 
    }); 

希望这会有所帮助。