2016-08-10 5 views
0

경로를 변경하면 새로로드 된 페이지가 맨 위로 스크롤되지 않습니다. 나는 ui-view 요소에 autoscroll = true 지시어를 추가했으나 맨 위로 스크롤되지 않았습니다. 아마도 오프셋 된 50px가 아래에있을 것입니다. 위로 고정 된 탐색 막대가 있어야한다고 생각합니다.사용자 지정 자동 스크롤 위쪽 지시문 각도

작업을 수행하는 사용자 지정 스크롤 지시문을 추가하면 새 페이지가 맨 위로 스크롤됩니다. 이 지시어가있는 유일한 장애물은 나를 아래로 스크롤하게 내버려 두지 않는다는 것입니다. 필자는 지시어에 익숙하지 않으며 사용자 지정 지시문에 누락 된 코드가 더 있음을 알고 있습니다. 아무도 이걸 도와 줄 수 있니?

<body id="myapp" ng-app="myapp"> 
    <div ng-include="'navbar/_navbar.html'" ng-controller="NavbarMenuCtrl"></div> 
    <div class="container-fluid"> 
    <div ui-view scroll-top><%= yield %></div ui-view> 
    </div> 
    <div ng-include="'footer/_footer.html'"></div> 
</body> 

내가 autoscroll 지시어는하지만, 작은 오프셋이 거의로 스크롤있어이되는 것을 사용할 수 바랬다 : 여기

angular.module('myapp') 
.directive("scrollTop", function ($window) { 
return function(scope, element, attrs) { 

angular.element($window).bind("scroll", function() { 
    scope.visible = false; 
    $window.scrollTo(0, 0); 
    scope.$apply(); 
}); 

}; 
}); 

는 HTML 코드입니다 : 여기

는 지침입니다 상단. 어쩌면 내가 맞춤 지시문을 만드는 대신 지시문을 해결할 수 있을지도 모른다. 나는 너의 도움, AngularJS에있는 아직도 초심자를 평가한다.

답변

1

autoscroll은보기가 업데이트 될 때 ui-view 요소의 맨 위로 스크롤하는 데 사용됩니다. 따라서 상태 변경이있을 때마다 전체 창을 스크롤하고 싶습니다. 실행 블록을 추가하여 상태 변경 내용을보고 스크롤 할 수 있습니다.

angular.module('myapp').run(['$rootScope','$window',function($rootScope,$window){ 
    $rootScope.$on("$stateChangeSuccess",function(){ 
     $window.scrollTo(0, 0); 
    }) 
}]); 
+0

감사합니다. – medev21

관련 문제