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

回答

相關問題