Scroll to bottom on state load

Hi guys,

Can’t manage to make the $ionicScrollDelegate.scrollBottom() work.
I am loading my page but it doesn’t scroll down.
I tried adding it in the controller associated to that view and also to a separate one called independently but none of them work.
Here is the code with separate controller for info:

<ion-content ng-controller="ScrollBotCtrl" has-footer ng-init="init()">
    <div class="row inline" ng-repeat="message in conversation.messages">
        <div class="padding pull-right chat-text-backg chat-text-box">
            {{message}}
        </div>
    </div>
    <div class="row inline" ng-repeat="message in conversation.messages">
        <div class="padding pull-left other-user-msg chat-text-backg chat-text-box" id="response-msg">
            {{ message }}
        </div>
    </div>
</ion-content>

The Controller:

  .controller('ScrollBotCtrl', function($scope, $ionicScrollDelegate) { $ionicScrollDelegate.scrollBottom();
    })

Not sure what I am doing wrong…
Thanks in advance for your help!

ps: yes I saw the other subject but it did not work as you can see

Have you tried wrapping it in a timeout? http://codepen.io/anon/pen/YPVLpe

1 Like

Awesome it worked!
Sorry I am starting with Angular & Ionic ! Did look quite a bit before asking thought!

So everytime I want something to start as soon as it loads I can use timeout and if I understood I can add the delay in ms also as an option.

Great! :smile:

I can’t say that would work for everything. Here are some posts on wrapping the scroll delegate in a $timeout:

1 Like

I usually use the events provided by $ionicView
http://ionicframework.com/docs/api/directive/ionView/

For Example:
$scope.$on(’$ionicView.afterEnter’, function(){
$ionicScrollDelegate.scrollBottom();
});

Hope that helps.