Question

如何链接到锚A标记内的其他AngularJS应用程序位置？我正在使用HTML5无散列模式，并希望避免让页面重新加载。

例如，在非HTML5模式下，我会这样做：

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

在HTML5模式下，我可以这样做：

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

但实际上这会导致浏览器重新加载新的URL。我也尝试使用ng-href和/#/path语法，但它们似乎都不像我想的那样。

如何从锚标记中正确链接？

Answer 1

<强>更新：

似乎可以在不使用$ location的情况下实现这一点，您只需要保持相同的基本链接即可。 From the docs：

当您使用HTML5历史记录API模式时，您将需要在不同浏览器中使用不同的链接，但您只需指定常规URL链接，例如：＆lt; a href =“/ some？foo = bar”＆gt;链路＆LT; / A＆GT;

当用户点击此链接时，


在旧版浏览器中，网址会更改为/index.html＃！/ some？foo = bar

在现代浏览器中，网址更改为/ some？foo = bar


如下所示，链接不会被重写;相反，浏览器将执行整页重新加载到原始链接。


包含目标元素的链接。示例：＆lt; a href =“/ ext / link？a = b”target =“_ self”＆gt; link＆lt; / a＆gt;

转到其他域的绝对链接。示例：＆lt; a href =“http://angularjs.org/”＆gt;＆lt; / a＆gt;

以'/'开头的链接，在定义base时会导致不同的基本路径。示例：＆lt; a href =“/ not-my-base / link”＆gt; link＆lt; / a＆gt;

旧：

您应该使用$location service。将它注入控制器并将其放在$ scope（或方便的方法）中：

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

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

Answer 2

在启用html5mode的情况下，这对我有用。

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

Answer 3

Angular Js使用哈希前缀后跟exclaimation。因此，如果你想使用锚标记，那么就这样使用它。

链接

https://docs.angularjs.org/tutorial/step_09

AngularJS应用程序在锚标记中链接/路由与HTML5模式

3 个答案: