Các liên kết/tuyến đường ứng dụng AngularJS trong thẻ neo với chế độ HTML5

Question

Làm cách nào để liên kết đến các vị trí ứng dụng AngularJS khác trong một thẻ neo A? Tôi đang sử dụng chế độ băm không HTML5 và muốn tránh việc trang thực sự tải lại.

Ví dụ, trong chế độ không HTML5 Tôi sẽ làm điều này:

<a href='#/path'>Link</a> 

Trong chế độ HTML5 tôi có thể làm điều này:

<a href='/path'>Link</a> 

Nhưng điều này thực sự làm cho trình duyệt để tải lại URL mới. Tôi cũng đã thử sử dụng ng-href và cũng là cú pháp /#/path nhưng không ai trong số họ dường như làm việc như tôi muốn.

Làm cách nào để liên kết chính xác từ thẻ neo?

Answer 1

Cập nhật:

Nó có vẻ như đây là tốt mà không sử dụng $ vị trí, bạn chỉ cần có để giữ liên kết cùng một cơ sở. From the docs:

Khi bạn sử dụng HTML5 chế độ lịch sử API, bạn sẽ cần phải liên kết khác nhau trong các trình duyệt khác nhau, nhưng tất cả các bạn phải làm là xác định các liên kết URL thông thường, chẳng hạn như: < a href = "/ some foo = bar "> liên kết </a>

Khi người dùng nhấp vào liên kết này,

• Trong một trình duyệt di sản, những thay đổi URL để /index.html#!/some?foo=bar
• Trong trình duyệt hiện đại, URL thay đổi thành/some? Foo = bar

Trong các trường hợp như sau, liên kết không được viết lại; thay vào đó, trình duyệt sẽ thực hiện tải lại toàn bộ trang về liên kết gốc.

• Liên kết chứa phần tử đích. Ví dụ: < a href = "/ ext/link? A = b" target = "_ self"> liên kết </a>
• Liên kết tuyệt đối đến một miền khác. Ví dụ: < a href = "http://angularjs.org/"> </a>
• Liên kết bắt đầu bằng '/' dẫn đến một đường cơ sở khác khi cơ sở được xác định. Ví dụ: < a href = "/ không-my-base/link"> liên kết </a>

Cũ:

Bạn nên sử dụng $location service. Tiêm nó vào bộ điều khiển và đặt nó trên $ phạm vi (hoặc trong một phương pháp tiện lợi):

function MainCtrl($scope,$location){ 
    $scope.goto = function(path){ 
    $location.path(path); 
    } 
} 

<a ng-click="goto('/path')">Link</a> 

Answer 2

này đã làm việc cho tôi trong html5mode kích hoạt.

<a ng-href='./path'>Link</a>