programing

AngularJS + Safari:페이지 전환 시 페이지를 맨 위로 강제 스크롤

javajsp 2023. 10. 31. 20:29

AngularJS + Safari:페이지 전환 시 페이지를 맨 위로 강제 스크롤

Angular를 사용하여 이상한 사파리 전용 스크롤 동작을 수행하고 있습니다.JS.

사용자가 페이지 간을 뒤집을 때마다 페이지가 AJAX인 것처럼 변경되고 있습니다.AngualrJS에 있는 것은 이해하지만, 사용자가 페이지를 전환할 때 브라우저가 상단으로 스크롤되지 않는 동작이 발생합니다.

새 컨트롤러를 사용할 때마다 브라우저를 강제로 상단으로 스크롤하려고 했지만 아무 것도 작동하지 않는 것 같습니다.

모든 컨트롤러 상단에서 다음 JS를 실행하고 있습니다.

document.body.scrollTop = document.documentElement.scrollTop = 0;

이것은 또한 Safari 전용 버그이며, 페이지가 바뀌면 다른 모든 브라우저가 상단으로 스크롤됩니다.비슷한 문제를 겪었거나 더 나은 해결 방법을 생각해 본 사람이 있습니까?

$window.scrollTo(0,0)페이지 상단으로 스크롤합니다.

방금 멋진 플러그인을 찾았습니다. (순수 각선미)애니메이션을 지원하는 JS)도 다음과 같습니다.

https://github.com/durated/angular-scroll

다음을 사용할 수 있습니다.

.run(["$rootScope", "$window", '$location', function($rootScope, $window,  $location) {

    $rootScope.$on('$routeChangeStart', function(evt, absNewUrl, absOldUrl){
        $window.scrollTo(0,0);    //scroll to top of page after each route change
}}])

또는 탭 스위치의 경우 컨트롤러에서 $window.scrollTo(0,0)를 사용할 수 있습니다.

$anchorScroll()을 사용해보셨습니까?여기에 기록되어 있습니다.

Angular를 사용하다가 똑같은 문제가 생겼습니다.코르도바 앱의 JS.일반 브라우저나 안드로이드에서는 문제가 없지만 ios에서는 Neil이 설명한 것과 같은 동작을 합니다.

앵귤러$anchorScroll에 대한 JS 문서는 그다지 훌륭하지 않기 때문에 이 링크를 게시하는 것이 훨씬 더 도움이 되었습니다.

http://www.benlesh.com/2013/02/angular-js-scrolling-to-element-by-id.html

$anchorScroll을 사용할 수 있습니다.

$scope.gotoTop = function (){
  // set the location.hash to the id of
  // the element you wish to scroll to.
  $location.hash('top');

  // call $anchorScroll()
  $anchorScroll();
};

@nonstop 버튼이 말한 것처럼, 추가.autoscroll="true"나에게ngView저도 요소가 통했습니다.답변에 대한 코멘트였고 그의 답변을 보기가 쉽지 않았기 때문에 여기서 언급합니다.

자세한 내용은 여기: https://stackoverflow.com/a/24549173/1578861

크롬과 비슷한 문제가 있습니다.그러나 특정 외부 라이브러리가 이 문제를 일으키는 것인지 아니면 그렇지 않은 것인지 알 수 없습니다.

하지만 이 코드는 앱 레벨에서 작성했고 작동합니다.

 $rootScope.$on('$viewContentLoaded', function(){
                $window.scrollTo(0, 0);
            });

위치 변경 성공 이벤트 후 $window.scrollTo(0,0)를 호출합니다.

$rootScope.$on("$locationChangeSuccess",
function(event, current, previous, rejection) {
  $window.scrollTo(0,0);
});

컨트롤러에서 실제로 다음을 수행할 수 있습니다.$부터window간단히 말하면window.scrollTo(0,0);주사를 놓을 필요 없이$window컨트롤러로 이동합니다.제게 아주 효과적이었습니다.

언급URL : https://stackoverflow.com/questions/18218868/angularjs-safari-force-page-to-scroll-to-top-when-pages-switch