Question

从我的AngularJS主页我需要滚动到另一页的锚标记。根据网址，这两个页面都作为部分html进入ng-view组件。在启动服务器时，主页被加载并从那里需要转到常见问题页面。我用＃使用普通的href，但是没有指向目标页面中的正确div。以下是我尝试使用$anchorScroll

的内容

这是控制器方法

＆＃13;

	
$scope.scrollToFaq = function(id) {
   $location.path("/faq")
   $location.hash(id);
   $anchorScroll();
}

＆＃13;

以下是我在home.html中使用它的方法

＆＃13;

<a ng-click="scrollToFaq('HERE')" href="" class="link">Here</a>

＆＃13;

但这不能正常运作。如果我直接加载faq页面然后返回并从主页单击锚链接，它就可以工作。是否可以使用`$ anchorScroll

执行此操作

Answer 1

尝试使用Angular的$ timeout服务。

$scope.scrollToFaq = function(id) {
 $location.path("/faq");
 $timeout(function(){
   $location.hash(id);
   $anchorScroll();
 }, delay);

此处delay 将是您希望等到锚点滚动发生的时间。我读过大约300毫秒/ 400毫秒的人工作。当我遇到此问题时，我只需要调用$anchorscroll内的$timeout。因此，请使用最适合您的情况。

注意：我正在寻找不使用$timeout的解决方案。我找到时会更新。

Answer 2

听起来像历史相关的问题。如果div已经被加载，一旦立即被发现。这个解决方案过去对我有用。也许是等待页面加载的想法。

$scope.scrollToFaq = function(id) {
    $location.path("/faq");
    $(window).on("load", function(){       
       $location.hash(id);
       $anchorScroll();
    });
    };

Answer 3

有同样的问题。但修好了:) 想法是更改为URL，等待半秒，然后跳转到锚点。

HTML：

<a href="" ng-click="goToAnchor('/', 'links')">Links</a>

控制器：

angular.module('exampleApp').controller('NavbarCtrl', function ($scope, $location, $timeout, $anchorScroll) {
      $scope.goToAnchor = function(path, anchor){
          $location.path('/');

          $timeout(function() {
             $anchorScroll(anchor);
          }, 500);
      };
});

使用AngularJS $ anchorScroll滚动到另一个页面的锚标记

3 个答案: