Abstract
Hi, I'm trying to manipulate scroll logic of my angular application (by hand), Since there is no such thing as onLoaded
event in angular, I was trying to accomplish that within $interval loop. It worked but UI was flickering, it looked like the scroll first goes all way up and then down again making everything look terrible. I've started looking for solution to my problem and found this answer. In which it was said that I have to be looking to $evalAsync
which is capable of queueing an operation before UI does it's rendering. It lead me to the following code:
var restoreScroll = function (scroll) {
angular.element($window).scrollTop(scroll);
var fn = function () {
debugger;
var value = angular.element($window).scrollTop();
if (value !== scroll) {
angular.element($window).scrollTop(scroll);
$rootScope.$evalAsync(fn);
}
}
$rootScope.$evalAsync(fn);
};
which hangs and shows my misunderstanding of Angular's $evalAsync
method.
Question
According to code above I need a method that would be trying to set the scroll until it succeeds, after when it should stop, how do you do that using $evalAsync
?
Thank you in advance!
==================
Edit
Ive managed to make it work, however not without the devils (the $$postDigest) in my code, so here goes:
var restoreScroll = function (scroll) {
angular.element($window).scrollTop(scroll);
var fn = function () {
var value = angular.element($window).scrollTop();
if (value !== scroll) {
angular.element($window).scrollTop(scroll);
$rootScope.$$postDigest(fn);
}
}
$rootScope.$$postDigest(fn);
};
Is there a better way?