Question

我的$routeProvider配置如下：

teachApp.config(['$routeProvider', '$locationProvider', function($routeProvider,       $locationProvider) {
    $routeProvider.
        when('/teach/', {templateUrl: 'views/login_view.html'}).
        when('/teach/overview', {templateUrl: 'views/overview_view.html'}).
        when('/teach/users', {templateUrl: 'views/users_view.html'}).
        otherwise({redirectTo: '/teach/'});
    $locationProvider.html5Mode(true);
}]);

在应用内，如果点击<a href="/teach/overview">Overview</a>等链接，则概述部分会按预期显示。但是，当我手动将地址栏中的URL更改为完全相同的URL时，我收到404错误。 $routeProvider配置错误了吗？

我正在使用MAMP localhost，应用的根网址为http://localhost/teach/

Answer 1

您也可以在网址中使用＃。

http://localhost/teach/#/overview

这不会向服务器发送请求，而是由Angular $ routeProvider拦截。

Answer 2

您需要将apache设置为redirect all paths to root。

当您直接打开http://localhost/teach/overview时，您的网络服务器正在尝试从未定义的路线提供页面。

在角度应用中，当您点击href路径为http://localhost/teach/overview的链接时，Angular会介入，而不是让您的浏览器从服务器请求页面，它会拦截您的点击事件并转到您的routeProvider查看要显示的客户端视图（这就是他们称之为“单页应用程序”的原因）。这就是为什么只要您不尝试直接打开链接就可以使用链接。

除了apache配置，您可能还想使用href值为base的{{1}}标记：

/teach/

这样你就可以让你的routeProvider不受固定前缀约束：

<base href="/teach/" />

AngularJS - 为什么在更改网址时$ routeProvider似乎无法正常工作，我收到404错误

2 个答案: