angularjs - 使用角度路线的意外结果

Question

我正在阅读“Amos Haviv 的 MEAN Web 开发”一书，但在关于 AngularJS 路由的章节的特定部分中，我没有得到预期的结果。本书的这一部分是关于为单页应用程序设置角度路由的。简而言之，我希望当我导航到http://localhost:3000时，AngularJS 路由器应该将请求重定向到http://localhost:300/#!/并从我的一个视图中看到两个文本框。

我完全按照书中给出的代码进行了操作，并多次检查代码以检查我是否遗漏了什么。书中的流程如下： - 在 public/application.js 文件中配置应用程序路由 - 在 public/example/example.client.routes.js 文件中使用 ngRoute 模块管理路由 - 包括视图中的脚本。 html 文件并添加 - 最后运行服务器

我的 application.js 文件：

var mainApplicationModuleName = 'mean';

var mainApplicationModule = angular.module(mainApplicationModuleName,
    ['ngRoute', 'example']);

    mainApplicationModule.config(['$locationProvider',
    function($locationProvider) {
    $locationProvider.hashPrefix('!');
    }
    ]);

angular.element(document).ready(function() {
    angular.bootstrap(document, [mainApplicationModuleName]);
});

我的 example.client.routes.js 文件：

angular.module('example').config(['$routeProvider',
function($routeProvider) {
$routeProvider.
when('/', {
templateUrl: 'example/views/example.client.view.html'
}).
otherwise({
redirectTo: '/'
});
}
]);

我的 example.client.view.html 文件：

<section ng-controller="ExampleController">
    <input type="text" id="text1" ng-model="name">
    <input type="text" id="text2" ng-model="name">
</section>

在我的 index.ejs 文件<section ng-view></section>中，除了 angular.js 和 angular-route.js 之外，我还包含了 example.client.routes.js、example.client.controller.js、example.client.module.js 的脚本标签

当我启动节点服务器时，我在控制台日志中看到以下请求：

服务器正在运行
GET / 304 32.496 ms - -
GET /img/logo.png 404 11.459 ms - 25
GET /lib/angular/angular.js 304 15.638 ms - -
GET /lib/angular-route/angular-route.js 304 12.533 毫秒 - -
获取 /example/example.client.module.js 304 14.989 毫秒 - -
获取 /example/controllers/example.client.controller.js 304 15.237 毫秒 - -
获取 /example/config/example.client.% 20%20%20%20%20%20%20%20routes.js 404 15.647 毫秒 - 76

根据这本书，我应该被重定向到http://localhost:3000/#!/并且应该看到我的两个表单，这是我观点的一部分，但这不是发生的事情。该页面仅保留在http://localhost:3000/并且我没有看到表单。在上面的日志中，我无法弄清楚为什么路线显示为

获取 /example/config/example.client.%20%20%20%20%20%20%20%20routes.js

而不是作为

获取 /example/config/example.client.routes.js

标签： angularjs