#html #angularjs #angularjs-ng-repeat #ng-repeat #anchor-scroll
#HTML #angularjs #angularjs-ng-repeat #привязка-прокрутка
Вопрос:
Я думаю, что я определил какое-то странное поведение AngularJS1, касающееся времени выполнения ng-repeat и, следовательно, конфликтующее со временем выполнения контроллера.
Мой контроллер автоматически прокручивается вниз до идентификатора привязки html: $anchorScroll(‘html_id’);
Это отлично работает со статическим html (static html plunker)
<div id="hello1">Hello1 </div>
Но anchorScroll, похоже, не работает, если он вызывается контроллером для divs, сгенерированных ng-repeat (плунжер ng-repeat)
<div id="{{ITEM.slug}}" ng-repeat="ITEM in LIST">{{ITEM.slug}}</div>
ПРИМЕЧАНИЕ:: anchorScroll на ng-repeat отлично работает с кнопкой, но я хочу, чтобы она автоматически прокручивалась ПРИ ЗАГРУЗКЕ…
(Я также пробовал использовать ng-init= для вызова функции прокрутки, но та же проблема с синхронизацией — поэтому он не может найти привязку … даже если закодирован ПОСЛЕ ng-repeat)
Есть идеи / обходные пути?
(похоже, нет никаких событий ng-repeat для привязки …)
Ответ №1:
Чтобы это сработало, $anchorScroll
оно должно выполняться после цикла дайджеста, чтобы элементы действительно были отображены.
Самый простой способ добиться этого — использовать $timeout
со 0
второй задержкой, которая создает обещание, которое будет разрешено. С 0
задержкой обещание будет обработано после завершения текущего цикла дайджеста, вместо того, чтобы обрабатываться немедленно.
testApp.controller('testCtrl', function($scope, $anchorScroll, $timeout) {
$scope.LIST = [{
"slug": "hello1"
}, {
"slug": 'hello2'
}, {
"slug": 'hello3'
}];
$timeout(function() {
$anchorScroll('hello3');
}, 0);
});
Комментарии:
1. Ты звезда! Хорошее чистое решение — именно то, что я искал — Спасибо 🙂