2016-07-01 2 views
1

그냥 맨 위로 스크롤하고 싶습니다.컨트롤러에서 AngularJS 스크롤이 작동하지 않습니다.

나는이 시도

:

$ window.scrollTo (0, 0);

작동하지 않았으며 window.scrollTo (0,0)도 수행하지 않았습니다. 그런 다음 시도 :

$ location.hash ('top'); //보기에서 사용

$ anchorScroll();

그 중 하나도 작동하지 않았습니다. 스크롤을위한 맞춤 각도 모듈을 보았습니다.하지만 어쨌든 작동해야하는 간단한 코드를 더 많이 사용하고 싶지는 않습니다. 아마도 컨트롤러/뷰에 문제가 있습니까? 여기

내 컨트롤러 :

.controller('PageCtrl', function ($scope, $stateParams, $window, $http, $ionicLoading, $ionicPopup, $timeout, $anchorScroll, $rootScope, $location, $compile) { 

var controller = this; 

$rootScope.$on('$stateChangeStart', 
    function (event, toState, toParams, fromState, fromParams, options) { 
     if (toState.name == 'app.page') { 
      if(fromState.name != 'app.page2') 
       controller.init(); 
     } 
    }); 

this.init = function() { 
    $ionicLoading.show({ 
     content: 'Logging in', 
     animation: 'fade-in', 
     showBackdrop: true, 
     maxWidth: 200, 
     showDelay: 1 
    }); 

    $window.scrollTo(0, 0); //should it be here? 
    window.scrollTo(0, 0); //not working at all?? 

    ..... 


} 


...... 

템플릿 :의 .config에서

<style> 
    ... 
</style> 

<ion-view view-title="something" ng-init="pgctrl.init()"> 
    <ion-nav-buttons side="right"> 
     <button class="button button-calm" ng-click="pgctrl.init()"> 
      New 
     </button> 
    </ion-nav-buttons> 
    <ion-content class="has-header" padding="true"> 
     ... 
    </ion-content> 
</ion-view> 

App.js가 :

.state('app.page', { 
     url: '/page', 
     views: { 
      'menuContent': { 
       templateUrl: 'templates/page.html', 
       controller: 'PageCtrl as pgctrl' 
      } 
     } 
    }) 
+1

윈도우 스크롤링 이벤트에 'stateChangeSuccess'를 사용하여 전환이 완료 될 때 실행되도록하는 방법은 어떻습니까? – anpsmn

답변

0

당신이 (jQuery를 사용하여 반대하지 않으면 어떤을 어쨌든 꽤 많이 사용하고 있습니다.), 이것을 시도 할 수 있습니다. this.init

$('body, html').animate({scrollTop: $('.view').offset().top}, "slow"); 

템플릿에서

<ion-view view-title="something" class="view" ng-init="pgctrl.init()"> 
    <ion-nav-buttons side="right"> 
     <button class="button button-calm" ng-click="pgctrl.init()"> 
      New 
     </button> 
    </ion-nav-buttons> 
    <ion-content class="has-header" padding="true"> 
     ... 
    </ion-content> 
</ion-view> 
0

나는 해결책을 발견했다. 나는이 이온 - 항법 - 버튼을 맨 위에 놓았 기 때문에 어떤 "스크롤 탑"이라도 우리가 이미 거기에 있다고 생각할 것이고, 따라서 그것이 효과가 없을 것이라고 생각할 것입니다. 일을했다

$ionicScrollDelegate.scrollTop(true); //where true says whether to animate it 

: 이온은 스크롤을 할 수 있도록하는 방법을 검색 한 후, 나는이를 발견했다. 이 문제를 해결하는 데 도움을 준 사람들에게도 감사드립니다!

0
$('html, body').animate({scrollTop: '0px'}, 400); 

간단히 말해서 this.400은 ms 단위의 시간 지연입니다. 0px는 수직 스크롤 위치입니다.

관련 문제