html页面加载完跳转到锚点,angularjs – 在页面加载后滚动到锚点

我需要设置一个ng-click事件,以便它加载一个新页面,然后,一旦页面加载,滚动到页面上的一个锚点.我已经尝试了在

this SO post提出的每个解决方案,但我无法使其正常工作.

大多数解决方案围绕滚动到已经加载的页面上的锚点.在加载新页面之后,我需要滚动.

这是我的视图代码:

See Jobs

这表示“个人资料卡”内的按钮.当用户点击卡片时,会将其带到个人资料页面.但是,当他们单击按钮时,需要将它们带到该配置文件页面的#jobs部分(因此代码中的goToResultJobs(r)之前的$stopPropogation()).

这是我的goToResultJobs方法.

$scope.goToResultJobs = function(result) {

var profileUrl = result.slug;

window.location = profileUrl;

};

我已经尝试使用$anchorScroll,并将锚点中的硬编码到profileUrl中,但是两者都不起作用.我对于Angular来说很新,所以我不知道我在这里失踪了什么.

更新1:尝试使用$timeout

这是我的ResultsCtrl中的goToResultJobs方法,当用户单击按钮时触发:

$scope.goToResultJobs = function(result) {

var url = window.location + result.slug + '#jobs';

location.replace(url);

};

这将加载/ name#jobs路径,调用下面的ProfileCtrl:

app.controller('ProfileCtrl', ['$scope', '$http', '$timeout', '$location', '$anchorScroll',

function($scope, $http, $timeout, $location, $anchorScroll) {

if(window.location.hash) {

$timeout(function() {

console.log('TEST');

// $location.hash('jobs');

// $location.hash('jobs');

$anchorScroll();

}, 1000);

};

}]);

此设置似乎可以正常工作,因为TEST仅在单击作业按钮时才出现在控制台中,但在用户只需单击该配置文件时才会显示.我现在面临的问题是页面开始加载,并且url栏中的路径更改为/ name#作业,但在页面完成加载之前,作业将从URL中删除.因此,当$an​​chorScroll()被调用时,哈希中没有锚标签可以滚动到.

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值