2013-07-04 51 views
4

當HTML5模式不加載路由我有指定的幾條路線:AngularJS與路徑參數直接進入網址

app.config(["$routeProvider", "$locationProvider", function($routeProvider, $locationProvider) { 
    $routeProvider. 
    when("/", { 
     templateUrl: "/ajax/home.html", 
     controller: "HomeController" 
    }). 
    when("/test/:id", { 
     templateUrl: "/ajax/test.html", 
     controller: "TestController", 
     resolve: { 
      data: function ($q, $http, $route) { 
       var deferred = $q.defer(); 
       var params = $route.current.params; 

       $http({method: "GET", url: "/api/test/" + params.id + ".json"}) 
        .success(function(data) { 
         deferred.resolve(data) 
        }) 
        .error(function(data){ 
         deferred.reject(); 
        }); 

       return deferred.promise; 
      } 
     } 
    }); 

    $locationProvider.html5Mode(true); 

}]); 

當有在通往/test/x另一條路線的鏈接,它工作正常。當不處於HTML5模式時,它也可以正常工作。但是,如果以HTML5模式直接導航至/test/x,則路徑不會加載,並且不會執行解析中的任何內容。

我已經瀏覽了很多AngularJS文檔,仍然無法弄清楚這一點。 PLZ :(

編輯:我已經做了更多的測試,並且這隻適用於有斜線的路線,如果有參數(如:id),它似乎並不重要。訪問/hello(如果定義了該路線)適用於HTML5和非HTML5模式的所有情況。類似/hello/world的東西總是以非HTML5模式工作,並且在通過點擊從其他路線更改路線時以HTML5模式工作鏈接刷新/hello/world時,轉到地址欄並按回車或點擊指向另一個網站的鏈接會導致它重新加載索引頁但不是實際的路徑

+0

你能解決這個問題嗎?我在這裏有完全相同的問題。 – destan

+4

它是1.1.5中的一個[bug](https://github.com/angular/angular.js/issues/2799)。將添加到 – tyscorp

+0

@ user27766這對我來說非常合適,謝謝!請將此作爲對此問題的回答,並將其標記爲答案。 – fsommar

回答

0

docs for the $location service表示使用HTML5莫de要求您在服務器端使用URL重寫來重寫您的應用程序入口點的所有鏈接(例如,的index.html)

如果你使用的是Apache提供給您的應用程序,那麼你可以建立一個.htaccess文件像這樣:

RewriteEngine on 
RewriteCond %{REQUEST_FILENAME} !-d 
RewriteCond %{REQUEST_FILENAME} !-f 
RewriteRule ^test/[0-9]+$ index.html [L] 

本想/test/<number>請求重定向到index.html和角度應該能夠路由它正確。

+2

這已經在工作。如果我去'/ test/',它會加載基本頁面,但似乎沒有做正確的路由。 – tyscorp

+0

奇怪的是,你能否在http://plnkr.co上創建一個可以在我的本地主機上測試的測試示例? –

+2

進入AngularJS IRC頻道之後,它變成了一個[bug](https://github.com/angular/angular.js/issues/2799)。我通過向 – tyscorp

5

<base href="/" />添加到<head>部分是一個修復程序,具體取決於您遇到的問題。

(這是我的答案,所以我想確保,使之更加明顯別人運行到這一點)

感謝@ user27766指點出來。