Angularjs AnchorScroll仅在第二次单击后工作

我相信我遇到了这里提到的同样的问题：

我查看了plunker，它可以正常工作，我已经准备好了路由，但是它仍然需要点击两下。我使用的是ng路由，而不是ui路由器。我怎样才能防止主播克罗尔的工作需要点击两下？因为第一个用户希望建立路由，而不是滚动到适当的锚

点击这里：

<a data-ng-click="gotoRequests()">Requests</a>

---

我可以用这里的一个答案来解决这个问题：

通过创建以下函数：

$scope.scrollTo = function(id) {
var old = $location.hash();
$location.hash(id);
$anchorScroll();
//reset to old to keep any additional routing logic from kicking in
$location.hash(old);
};

我称之为：

<a href="" data-ng-click="scrollTo('pendingrequests')">Yipee</a>

<div id="pendingrequests"></div>

---

最新更新

AngularJS 1.4.0允许您直接将id作为参数传递，而无需使用哈希更新URL

点击期间

<div data-ng-click="gotoRequests(pendingrequests)"> </div>

---

angular 1也有同样的问题，我使用

$timeout

解决了这个问题。下面是我如何做到这一点的一个例子

angular.module('app').controller('MyTestController', ['$scope', '$location', '$anchorScroll', '$timeout', function($scope, $location, $anchorScroll, $timeout) {
function scrollToElement (element, offset){
    $timeout(function() {
      $anchorScroll.yOffset = offset; // add extra pixels to scroll initially
      var old = $location.hash();
      $location.hash(element);
      $anchorScroll();
      $location.hash(old);
    });
  }
scrollToElement('element ID', 100);
}]);

---

您需要为300添加

$timer

，例如：

this.gotoBottom = function(scrollId) { 
    $timeout(function() { 
        $location.hash(scrollId); $anchorScroll(scrollId); 
    }, 300);
}

---

您可以在代码示例中包括控制器吗？问题可能就在这里，因为这个代码示例与（我使用的演示程序）完全相同，它相当长。。。我刚刚注意到Angular docs页面也有同样的问题：！在这种情况下，您可以在

$scope.gotoRequests = function(divId) {  $anchorScroll(divId); }

angular.module('app').controller('MyTestController', ['$scope', '$location', '$anchorScroll', '$timeout', function($scope, $location, $anchorScroll, $timeout) {
function scrollToElement (element, offset){
    $timeout(function() {
      $anchorScroll.yOffset = offset; // add extra pixels to scroll initially
      var old = $location.hash();
      $location.hash(element);
      $anchorScroll();
      $location.hash(old);
    });
  }
scrollToElement('element ID', 100);
}]);

this.gotoBottom = function(scrollId) { 
    $timeout(function() { 
        $location.hash(scrollId); $anchorScroll(scrollId); 
    }, 300);
}