Clicking tab doesn't scroll to the top of the page


#1

When on the first page in a tab and clicking the tab icon, in iOS the expected behavior is that the page scrolls to the top. I’m pretty sure this used to work in Ionic, but not since beta14.

Here is a Codepen to illustrate the problem:

  1. Click ‘About’ tab

  2. Scroll to the bottom

  3. Click button

  4. Click the ‘About’ tab

  • Expected: page navigates back to first page in that tab history
  • Actual: page navigates back to first page in that tab history
  1. Click the ‘About’ tab again
  • Expected: the page scrolls to the top
  • Actual: Nothing happens

Is this a bug, or was the feature removed for a reason? If so, how can I enable this behavior for my app?


#2

Yes, I agree this should be added as a feature in the framework. Anyway, this functionality can be replicated easily if you need it.
First, override ng-click on the tab:

ng-click="myTabSelected()"

Then, on your controller, use:

$scope.myTabSelected = function(){
    if ($ionicTabsDelegate.selectedIndex() == 0){ // this is the index of the selected tab
        $ionicScrollDelegate.scrollTop(true);
    }
    // we need to change the tab by ourselves
    $ionicTabsDelegate.select(0);
}