Ссылки/маршруты приложения AngularJS в привязном теге с режимом HTML5

Как мне привязать к другим местам приложения AngularJS в теге привязки A? Я использую HTML5 hashless mode и хотел бы избежать загрузки страницы на самом деле.

Например, в режиме, отличном от HTML5, я бы сделал следующее:

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

В режиме HTML5 я могу это сделать:

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

Но это фактически заставляет браузер перезагружать новый URL. Я также пробовал использовать ng-href, а также синтаксис /#/path, но ни один из них не работает, как хотелось бы.

Как правильно привязать тег привязки?

Ответ 1

Обновление

Кажется, что это возможно без использования $location, вам просто нужно сохранить одну и ту же базовую ссылку. Из документов:

Когда вы используете режим API истории HTML5, вам понадобятся разные ссылки в разных браузерах, но все, что вам нужно сделать, это указать регулярные URL-ссылки, такие как: < a href= "/some? foo = bar" > link </a>

Когда пользователь нажимает на эту ссылку,

В устаревшем браузере URL-адрес изменяется на /index.html #!/some? foo = bar

В современном браузере URL-адрес изменяется на /some? foo = bar
В следующих случаях ссылки не переписываются; вместо этого браузер выполнит полную перезагрузку страницы по исходной ссылке.

Ссылки, содержащие целевой элемент. Пример: < a href= "/ext/link? A = b" target = "_ self" > link </a>

Абсолютные ссылки, которые переходят в другой домен. Пример: < a href= "http://angularjs.org/" > </a>

Ссылки, начинающиеся с '/', которые приводят к другому базовому пути, когда база определена. Пример: < a href= "/not-my-base/link" > link </a>

Старый:

Вы должны использовать службу $location. Внесите его в контроллер и поместите его в область $(или в удобном методе):

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

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

Ответ 1

Ответ 2