Спасибі Енді на прикладі, це було дуже корисно. Я закінчив
реалізацію дещо іншої стратегії, оскільки я розробляю прокрутку на
одній сторінці і не хочу, щоб Angular оновлювався при використанні
хешбанг-URL-адреси. Я також хочу зберегти назад/вперед дії
браузера.
Замість того, щоб використовувати директиву та хеш, я
використовую $ $ $ scope $. Годинник у $ location.search і отримав
ціль туди. Це дає хороший чіткий ярлик
Мій елемент
Я прив'язав код годинника до моєї декларації модуля у app.js
так:
.run(function($location, $rootScope) {
$rootScope.$watch(function() { return $location.search() }, function(search) {
var scrollPos = 0;
if (search.hasOwnProperty('scroll')) {
var $target = $('#' + search.scroll);
scrollPos = $target.offset().top;
}
$("body,html").animate({scrollTop: scrollPos}, "slow");
});
})
Застереження з наведеним вище кодом полягає в тому, що якщо ви
отримуєте доступ до URL безпосередньо з іншого маршруту, DOM може
не завантажуватися вчасно для виклику $ target.offset() у jQuery.
Рішення полягає в тому, щоб вставити цей код у веб-переглядач $
viewContentLoaded. Остаточний код виглядає приблизно так:
.run(function($location, $rootScope) {
$rootScope.$on('$viewContentLoaded', function() {
$rootScope.$watch(function() { return $location.search() }, function(search) {
var scrollPos = 0
if (search.hasOwnProperty('scroll')) {
var $target = $('#' + search.scroll);
var scrollPos = $target.offset().top;
}
$("body,html").animate({scrollTop: scrollPos}, "slow");
});
});
})
Перевірено Chrome і FF