javascript - 无法修复我的 angularjs 应用程序路径中的主题标签

Question

我知道你们会说“这是重复的”，但这对我不起作用。

我正在做完全相同的事情，这是发生的事情。

这是我的配置代码:

portfolioApp.config(function($routeProvider, $locationProvider) {
    $routeProvider
        .when('/home', {
            controller: 'portfolioController',
            templateUrl: 'partials/home.htm'
        })
        .otherwise({redirectTo: '/home'});
    if(window.history && window.history.pushState){
        $locationProvider.html5Mode(true);
    }

});

没有 locationProvider 并将路径设置为“/”而不是“/home”的 URL 将是:

http://localhost:8080/portfolio/#/

好的，我想删除主题标签和“投资组合”路径，这样就可以了:

http://localhost:8080/home

使用我发布的配置，它可以做到(我第一次刷新)。但是会发生什么？碰巧如果我用新路径再次刷新页面...我收到 404 Tomcat 错误。

在第一次刷新时，当我写入 localhost:8080/portfolio 并且路径被转换为“/home”时，我在控制台中收到一条错误消息，指出找不到“partials/home.htm”404。

所以无论哪种方式，它都无法读取我的部分内容，然后当我刷新时，一切都被破坏了。

我该如何解决这个问题？我做错了什么？

Answer 1

确保将这些包含到 HTML 文档 header 中的脚本中，您将在其中实现模块。下面提供的两个用于实现最新版本的 Angular 以及最新版本的 Angular 路由脚本:

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.3/angular.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.3/angular-route.js"></script>

确保将 ngRoute 注入(inject)到模块中，这是我的示例:

angular.module('controller', ['ngRoute','ngResource', 'ngCookies', 'ngSanitize'])

这是我的配置 block 的示例，请确保同时注入(inject) routeProvider 和 locationProvider:

.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider){

    $routeProvider
        .when('/', {
            templateUrl: '../partials/member.php',
            controller: 'Member',
            access: 'member'
        })
        .when('/leaderboard', {
            templateUrl: '../partials/leaderboard.html',
            controller: 'Leaderboard',
            access: 'member'
        })
        .otherwise({ 
            redirectTo: '/' 
        });
        $locationProvider.html5Mode(true);

}])

如果您执行了所有这些操作但仍然无法正常工作，请发布您的代码 plunker。谢谢。