我正在尝试使用$anchorScroll and $location.hash()滚动到div。我在页面顶部有一个底部。当我单击底部时，我希望页面向下滚动到我有一个页面的底部<div id="target">.

由于某种原因，第一次单击该按钮时，我的页面不会滚动。如果第二次单击，页面就会滚动。之后滚动效果很好。如果我刷新页面，可以重现这种奇怪的行为。

我的控制器中有这段代码：

$scope.scrolldown = function() {
  $location.hash('target');
  $anchorScroll();
}

我知道$location.hash('target')line 应该将哈希值附加到我的 URL 末尾。

这是我的页面首次加载时的 URL：

http://run.plnkr.co/iqvdGjdeCP4idP4D/

当我第一次点击按钮后，它变成：

http://run.plnkr.co/iqvdGjdeCP4idP4D/#/target

这是不对的（并且页面无法正确滚动）。

当我第二次点击按钮后，它变成：

http://run.plnkr.co/iqvdGjdeCP4idP4D/#/target#target

从此时开始，页面开始正确滚动，但 URL 对我来说仍然看起来很奇怪——为什么我需要两个哈希值？

我想知道为什么该按钮仅在第二次单击后才起作用以及如何更正它。

Update

我将路由添加到我的代码中，滚动现在工作正常。 这是我的路由演示。 http://plnkr.co/edit/KRC9Ou?p=preview

看看这个问题，其中包含一个可能的解决方案：禁止在查询参数更改时重新加载基于 ui-router 的视图 https://stackoverflow.com/questions/21425378/supress-reloading-of-ui-router-based-view-on-query-parameter-change

第二次单击该按钮时它会起作用，因为哈希值不会更改（因此路由不会重新加载）。第一次点击时注意到页面闪烁了吗？这表明整个 DOM 已被重新渲染。