在 AngularJS 1.2 中启用 HTML 5 模式 [英] Enabling HTML 5 Mode in AngularJS 1.2

问题描述

我正在开发一个需要使用 HTML 5 模式的应用.由于我正在迁移现有站点以使用 AngularJS 1.2，因此我的 URL 中不能有#"标签.目前，我有以下几点:

I'm working on an app that needs to use HTML 5 mode. Due to the fact that I am migrating an existing site to use AngularJS 1.2, I cannot have '#' tags in my URL. Currently, I have the following:

angular.module('myApp', ['ngRoute']).
  config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
  $locationProvider.html5Mode(true);

  $routeProvider
    .when("/home", {templateUrl:'home.html', controller:'homeController'})
    // other routes are defined here..
    .otherwise({redirectTo: '/home'});
  }]);

不幸的是，当我访问http://myServer/home"时，我的应用在启用 html 5 模式时无法运行.我得到 404.但是，当我访问 http://myServer/ 时，它可以工作.当我启用 html5 模式时，它就像深层链接不起作用一样.如果我注释掉$locationProvider.html5mode(true);"那行，站点就会运行.但是，由于我正在迁移现有站点，因此我的 URL 中不能再包含哈希标记.

Unfortunately, when I visit 'http://myServer/home', my app does not work when html 5 mode is enabled. I get a 404. However, when I visit http://myServer/ it works. Its like deep-linking doesn't work when I have html5 mode enabled. If I comment out the line that says "$locationProvider.html5mode(true);", the site functions. However, once again, I cannot have hash tags in my URL due to the fact I'm migrating an existing site.

我误解了 html5mode(true) 的工作原理吗?还是我做错了什么?

Am I misunderstanding how html5mode(true) works? Or, am I doing something wrong?

谢谢

推荐答案

如果您使用的是 html5mode，您需要在服务器端进行更改以返回您的入口点 index.html(主应用程序页面)在任何 URL 请求上.然后 angular 应用程序将解析 URL 并加载所需的页面.

If you're using html5mode you need make changes on the server side to return your entry point index.html (main app page) on any URL request. Then angular app will parse URL and load needed page.

这篇关于在 AngularJS 1.2 中启用 HTML 5 模式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！