使用 ASP.NET MVC 时无法从 angular 路由中删除 !#

Question

我在我的 MVC 应用程序中使用 AngularJS。我面临着 !# 出现在 URL 中的非常常见的路由问题。我一直在寻找解决方案，几乎在每一个被接受的答案中都找到了这个解决方案，但在我的案例中却惨遭失败。我在路由中使用了这行代码：

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

这一行没有任何改变。我也试过这个：

$locationProvider.html5Mode(true);

但运气不好。另外，我在我的 <head> 标签中使用了这个标签：

<base href="/">

这一行也没有任何改变。

我的路由代码和导航代码如下：

app.config(function ($routeProvider, $locationProvider) {
    $routeProvider
        .when("/", {
            templateUrl: "payment/MakePayment",
            controller: "paymentController"
        })
        .when("/SearchPayment", {
            templateUrl: "payment/SearchPayment",
            controller: "paymentController"
        })
        .when("/Flush", {
            templateUrl: "payment/InvalidateCacheForIndexAction",
            controller: "paymentController"
        });
    $locationProvider.html5Mode(true).hashPrefix('!');
});

导航码-

    <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav">
            <li><a href="/">Make Payment</a></li>
            <li><a href="#SearchPayment">Search Payment</a></li>
            <li><a href="#Flush">Flush</a></li>                    
        </ul>
    </div>

网站启动后，我在浏览器中看到 http://localhost:56810/。当我点击 Search Payment link 时，浏览器中的 URL 显示为 http://localhost:56810/#!#SearchPayment。 Flush 也会发生同样的事情。导航也不会发生。这意味着给定的 routeProvider 路由不会处理 URLs 中的更改。

Answer 1

只需使用

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

并删除 #

<li><a href="SearchPayment">Search Payment</a></li>
<li><a href="Flush">Flush</a></li>

或

只需使用以下内容，这样您就不必将服务器端配置为仅处理 "/"

$locationProvider.html5Mode(false).hashPrefix('');

并删除 #

<li><a href="SearchPayment">Search Payment</a></li>
<li><a href="Flush">Flush</a></li>

使用 ASP.NET MVC 时无法从 angular 路由中删除 !#

Unable to remove !# from angular routes while using ASP.NET MVC

asp.net-mvc

angularjs

angular-routing