javascript - AngularJS 的 $routeProvider 错误

标签 javascript angularjs ngroute

我今天开始学习AngularJS,但我被“路由”部分困住了。我已经创建了一个 Controller 和一个 View (见下文),但是当我尝试在本地服务器上运行它时,出现以下错误:

Uncaught Error: [$injector:modulerr] Failed to instantiate module AMail due to: 
Error: [$injector:unpr] Unknown provider: $routeProvider

如果 ngRoute 服务内置于 Angular 中,为什么错误会提示该服务未知?

controller.js

var aMailServices = angular.module('AMail', []);
// Set up our mappings between URLs, templates, and controllers
    function emailRouteConfig($routeProvider) {
        $routeProvider.
        when('/', {
           controller: ListController,
           templateUrl: 'list.html'
        }).
        when('/view/:id', {
           controller: DetailController,
           templateUrl: 'detail.html'
        }).
        otherwise({
           redirectTo: '/'
       });
   }

// Set up our route so the AMail service can find it
aMailServices.config(emailRouteConfig);

messages = [{
       id: 0, 
           sender: '<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f29897939cb2819d9f97919d9f82939c8bdc919d9f" rel="noreferrer noopener nofollow">[email protected]</a>', 
           subject: 'Hi there, old friend',
       date: 'Dec 7, 2013 12:32:00', 
           recipients: ['<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="3f584d5a587f4c50525a5c50524f5e5146115c5052" rel="noreferrer noopener nofollow">[email protected]</a>'],
           message: 'Hey'
       }];

// Publish our messages for the list template
function ListController($scope) {
    $scope.messages = messages;
}

// Get the message id from the route (parsed from the URL) and use it to
// find the right message object.
function DetailController($scope, $routeParams) {
    $scope.message = messages[$routeParams.id];
}

index.html

<html ng-app="AMail">
  <head>
  </head>
  <body>
    <h1>A-Mail</h1>
    <div ng-view></div>
    <script src="angular.js"></script>
    <script src="controller.js"></script>
  </body>
</html>

最佳答案

你需要声明对ngRoute的依赖:

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

关于javascript - AngularJS 的 $routeProvider 错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23311429/

相关文章:

javascript - ngroute 后指令加载不正确

javascript - 使用 $location.path(..) 路由 ng-view

javascript - JS 测试是否为 10 的倍数

javascript - Jasmine '.jshintrc' 文件夹的一部分 'karma.conf.js' 和 'test' 是否应该受版本控制

javascript - 在 Java 中尝试从 AngularJS 尝试时,PUT/POST Rest api 调用不起作用

javascript - AngularJS - 使用 $resource 并与 RESTful 数据源交互

AngularJS:$route 到底是如何工作的?

javascript - toFixed 不工作

javascript - 运行条形码扫描仪时如何停止提交表单

javascript - getAttribute 函数不起作用