AngularJS：路线提供商转变“/”到％2F

我建立一个AngularJS参加办法，我有建设第二视图时URL问题：AngularJS：路线提供商转变“/”到％2F

我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", 
       controllerAs: "vm", 
       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之前，它到达浏览器，并出现错误。

感谢

拉斐尔

来源

2016-08-12 Rafael Munoz

你读过这http://stackoverflow.com/questions/24814472/angularjs - 转化 - 我-NG-HREF的URL斜杠为-2F？ – MMhunter

它将与散列工作 –

@MMhunter：是的，我读了它，我在我的解决方案尝试它，但它没有奏效。 –

您启用HTML5Mode，这意味着角试图对我们history.pushState而不是使用哈希做路由。猜你的服务器不支持pushState或该选项未启用？

API文档：https://docs.angularjs.org/api/ng/provider/ $ locationProvider

来源

2016-08-12 08:37:16

感谢您的帮助，我已阅读该链接，并在HTML5部分添加了rewriteLinks：true，并且工作正常，：我登陆正确的URL，它显示正确的视图，但如果我刷新页面，它全部消失 - >空白页面:-( –

听起来像你需要正确配置你的服务器。这似乎不是一个问题另外，“空白页”并不是真正的堆栈跟踪;） –

我在我的计算机（localhost）本地工作仍在开发中。无论如何，感谢您的帮助，至少我在两天后继续前进。来自邻国卡尔斯鲁厄的问候 –

我遇到了同样的问题。删除'＃'适用于我。你可以这样写<a asp-controller="Contact" asp-action="Details" ng-href="/details/{{contact.firstName}}" >{{ contact.firstName}}</a>

来源

2016-12-12 12:19:50 Clarence

愿这一个会帮助你。

包括$ 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" 

         }); 


    });

来源

2017-01-25 10:18:39

我有同样的问题，增加locationProvider等之后的工作如下

myApp.config(["$routeProvider","$locationProvider", function ($routeProvider,$locationProvider) { 
    $routeProvider 
     .when("/home", { 
      templateUrl: "Templates/home.html" 
     }) 
     .when("/class", { 
      templateUrl: "Templates/class.html" 
     }).otherwise({ 
     redirectTo: "/class" 
    }); 
    $locationProvider.hashPrefix(''); 
}]);

HTML

<ul> 
     <li> 
      <a href="#/home">Home</a> 
     </li> 
     <li> 
      <a href="#/class">Class</a> 
     </li> 
</ul>

来源

2017-06-18 20:40:21

AngularJS：路线提供商转变“/”到％2F

回答

相关问题