javascript - AngularJS + UI-Router - 在没有 HashBang 的情况下以 HTML5 模式手动输入 URL

我目前正在使用带有 UI-Router 的 AngularJS 进行状态管理并在后端表达。

我目前启用了 hash bang 模式，并且一直在尝试寻找一种解决方案，该解决方案允许您在地址栏中手动键入 URL，而无需使用 hash bang。

因此，例如而不是键入:

www.mysite.com/#!/page1

我希望能够打字

www.mysite.com/page1

我试过启用 html5Mode:

$locationProvider.html5Mode(true)
                 .hashPrefix('!');

但它仍然不起作用。通过上述更改，单击任何 URL 将重写并将位置从 '#!/page1' 更改为 '/page1'。这很棒。

但是，手动输入带有“/page1”的 URL 不起作用并给出无效路径错误。如果我输入它时包含哈希爆炸，即 '#!/page1' 那么它会工作，并且在页面加载后将 URL 重写为 '/page1'。

那么我在这里做错了什么？

我的状态是这样的:

state('login', {
            url: '/login',
            templateUrl: 'login.html'
        }).
   state('parent', {
            url: '/hello',
            abstract: true,
            template: '<ui-view/>'
        }).
    state('parent.home', {
            url: '',
            controller: 'SomeCtrl',
            templateUrl: 'page.html'
        }).
        state('parent.file', {
            url: '/bob',
            controller: 'SomeCtrl2',
            templateUrl: 'file.html'
        })

最佳答案

更新:
您的代码对我来说看起来不错，我失去了经验并认为这是服务器问题。

有几种方法可以处理这个问题，但据我所知，它们只是服务器端。

using AngularJS html5mode with nodeJS and Express

How do I configure IIS for URL Rewriting an AngularJS application in HTML5 mode?

您不能直接转到路由 - mywebsite.com/page1 的原因是因为 angular 应用程序本身(位于 index.html 页面上)需要拦截/引导您到 mypage。这就是为什么您看到页面本身永远不会重新加载， View 只是在您的应用程序中发生变化。您也可以通过刷新页面来测试这一点。

您需要在服务器端实现一些东西，它接受您的请求(IE:/page1)并将所有请求路由到 index.html，Angular 将负责其余的工作。

另外:当您使用 #/page1 时，您仍在请求索引页，angular 会识别 # 并相应地进行路由

编辑:附加信息

关于javascript - AngularJS + UI-Router - 在没有 HashBang 的情况下以 HTML5 模式手动输入 URL，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/26286578/