javascript – AngularJS:路由提供商将“/”更改为/

前端之家收集整理的这篇文章主要介绍了javascript – AngularJS:路由提供商将“/”更改为/前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
参见英文答案 > AngularJS All slashes in URL changed to %2F6个
我正在构建一个AngularJS应用程序,在构建第二个视图时我遇到了URL问题:

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

(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",templateUrl: "/views/detailsView.html"
            });

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

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

        });
})();

在我的HTML中,我有这个链接

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

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

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

但是,当我单击链接导航到新页面时,URL将更改为

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

通过%2更改“/”会使应用程序失败并显示空白页面.

你知道为什么会这样,以及如何纠正这个问题?

我已经阅读了类似的帖子,但是它们似乎都没有用,因为我在访问编码器的URL到达浏览器之前没有访问它并且错误就在那里.

谢谢

拉斐尔

解决方法

愿这一个会帮助你.

include $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"

                        });


    });
原文链接:https://www.f2er.com/js/151031.html

猜你在找的JavaScript相关文章