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

2019年8月5日 273次阅读

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

这是控制器方法

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

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

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

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

最佳答案 尝试使用Angular的$timeout服务.

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

这里延迟是你想要等到锚点滚动发生的时间.我读过大约300毫秒/ 400毫秒的人工作.当我遇到这个问题时,我只需要在$timeout内调用$anchorscroll.因此,请使用最适合您的情况.

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

点赞