在 ngRoute 中刷新页面时找不到页面

page not found when refresh a page in ngRoute

本文关键字：找不到 刷新 ngRoute      更新时间：2023-09-26

我正在使用angularjs ngRoute来路由单个页面应用程序。它显示本地主机/关于或本地主机/博客。当我重新加载时，"无法获取/关于"。我该如何解决这个问题。

我的路由器配置如下。

var myApp = angular.module('myApp',['ngRoute']);
myApp.config(['$locationProvider','$routeProvider',function($locationProvider,$routeProvider){
    $locationProvider.html5Mode(true);
    $routeProvider
        .when('/',{
            templateUrl: 'views/pages/home.html',
            controller: 'homeCtrl'
        })
        .when('/about',{
            templateUrl: 'views/pages/about.html',
            controller: 'aboutCtrl'
        })
        .when('/contact',{
            templateUrl: 'views/pages/contact.html',
            controller: 'contactCtrl'
        })
        .when('/blog',{
            templateUrl: 'views/pages/blog.html',
            controller: 'blogCtrl'
        })
        .otherwise({redirectTo: '/home'});
    }]);

我只使用角度。

这是因为这段代码

$locationProvider.html5Mode(true);

将其设置为 false 将在每个 url 的开头添加一个#，因此无论您重新加载哪个页面，服务器都会为您提供索引页。

您可能使用的是服务器路由，而不是 AngularJS 路由。默认情况下，AngularJS使用路由后#路由URL路由。例如 http://localhost:8080/#/about。

此外，您可以将HTML5路由与使用$locationProvider.html5Mode(true)一起使用，我猜您正在使用http://localhost:8080/about路由。

文档对 AngularJS 路由不是很清楚。它谈到了Hashbang和HTML5模式。事实上，AngularJS路由以三种模式运行：

  • 哈希邦模式
  • HTML5 模式
  • HTML5模式下的哈希邦

这是因为您使用的是浏览器不支持的HTML5模式。如上所述@Mumpo。

您应该更改此行 

$locationProvider.html5Mode(true);

到此行

$locationProvider.html5Mode(false);

这将启用哈希邦模式，并在您的 URL 之前附加一个 # 符号

有关这三种模式的进一步深入了解。请参考这个 Stackoverflow 问题 这里.希望这会有所帮助

相关文章：