AngularJS：路由提供者更改“/”进入％2F [英] AngularJS: route provider changes "/" into %2F

问题描述

我正在构建一个AngularJS应用程序，在构建第二个视图时我遇到了URL问题：

I am building an AngularJS appplication and I have problems with the URL when building the second view:

我的appContact.js看起来像这样：

My appContact.js looks like this:

(function () {

    "use strict";

    var app = angular.module("appContacts", ["simpleControls", "ngRoute"])
        .config(function ($routeProvider, $locationProvider) {

            $routeProvider.when("/", {
                controller: "contactsController",
                controllerAs: "vm",
                templateUrl: "/views/contactsView.html"
            });

            $routeProvider.when("/details/:firstName", {
                controller: "contactsDetailsController",
                controllerAs: "vm",
                templateUrl: "/views/detailsView.html"
            });

            $routeProvider.otherwise({ redirectTo: "/"});

            $locationProvider.html5Mode({
                enabled: true,
                requireBase: false
            });

        });
})();

在我的HTML中，我有以下链接：

In my HTML I have this link:

<a asp-controller="Contact" asp-action="Details" ng-href="#/details/{{contact.firstName}}" >{{ contact.firstName}}</a>

当我在浏览器中悬停时，我有正确的建议链接，如：

When I hover in the Browser I have the correct proposed link like:

 **http://localhost:8000/#/details/Matthew**

但是当我点击链接导航到新页面时，URL会变为

But when I click the link to navigate to the new page the URL changes to

 **http://localhost:8000/#%2Fdetails%2FMatthew** 

更改％2的/会使应用失败并显示空白页。

Changing the "/" by %2 make the app fail and a blank page is shown.

您知道为什么会这样以及如何解决此问题吗？

Do you know why is this and how to correct this issue?

我已经阅读了类似的帖子，但是它们似乎都没有用，因为我没有访问编码的URL到达浏览器之前就出现了错误。

I have already read similar posts her but none of them seems to work since I have not access to the encoded URL before it reaches the Browser and the error is there.

谢谢

Rafael

推荐答案

<这可能会帮助你。

在你的配置中包含 $ locationProvider.hashPrefix（''）; 。

           Example.
         <div>
            <a href ="#/table">table</a>
            <a href ="#/addPage">addForm</a>
        </div>

        app.config(function($routeProvider, $locationProvider) {
            $locationProvider.hashPrefix('');
         $routeProvider.when("/addPage", {

                           templateUrl :"partials/add.html",
                           controller : "ngRepeatTableCtrl"

                         })
                      .when("/tablePage", {

                           templateUrl :"partials/table.html",
                           controller : "ngRepeatTableCtrl"
                     })
                      .otherwise({
                             templateUrl :"partials/table.html",
                             controller : "ngRepeatTableCtrl"

                        });


    });

这篇关于AngularJS：路由提供者更改“/”进入％2F的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！