Scroll position is lost with tabs in tabs


#1

I’ve got a pretty complicated app, where I’ve got Tabs within Tabs. (see http://cl.ly/image/1Z1J1i350x3H)
Each one got it’s own state.

Now each one is basically a big list of items. So it would be great to actually save the position when the user clicks an item and gets transitioned to the detail view of the item.

However, that is not working.
A list within a main tab with the position saved is working great though.

I am using ion-nav-view, so I can’t use $ionicScrollDelegate to handle it myself. Any ideas?

Code (CoffeeScript):

$stateProvider.state("tab",
    url: "/tab"
    abstract: true
    templateUrl: "tpls/tabs.html"
  )
  .state("tab.programs",                      # the first tab
    url: "/programs"
    abstract: true
    views:
      "programs-tab":
        templateUrl: "tpls/programs.html"
        controller: "ProgramsCtrl"
  )
    .state("tab.programs.events",                      # the tab within the tab
      url: "/events"
      views:
        "events":
          templateUrl: "tpls/programs/events.html"
          controller: "ProgramsEventsCtrl"
    )
    .state("tab.programs.speakers",                  # the tab within the tab
      url: "/speakers"
      views:
        "speakers":
          templateUrl: "tpls/programs/speakers.html"
          controller: "ProgramsSpeakersCtrl"
    )
    .state("tab.programs.favorites",                   # the tab within the tab
      url: "/favorites"
      views:
        "favorites":
          templateUrl: "tpls/programs/favorites.html"
          controller: "ProgramsFavoritesCtrl"
    )
    .state("tab.programs.events.article",
      url: "/:id"
      views:
        "programs-tab@tab":
          templateUrl: "tpls/programs/article.html"
          controller: "ProgramsArticleCtrl"
    )

programs.html

<ion-nav-buttons side="right">
  <button class="button-icon" ng-click="toggleSearch()">
    <i class="icon ion-ios7-search"></i>
  </button>
</ion-nav-buttons>

<div class="sub-bar">
  <div class="sub-bar--tabs">
    <a class="sub-bar--tab" ui-sref="tab.programs.events" ui-sref-active="is--active">
      <span>Veranstaltungen</span>
    </a>
    <a class="sub-bar--tab" ui-sref="tab.programs.referees" ui-sref-active="is--active">
      <span>Referenten</span>
    </a>
    <a class="sub-bar--tab" ui-sref="tab.programs.favorites" ui-sref-active="is--active">
      <span>Favoriten</span>
    </a>
  </div>
</div>

<div class="search-bar">
  <div class="search-bar__field">
    <i class="icon ion-ios7-search search-bar__icon"></i>
    <input ng-model="searchText" type="text" placeholder="Suche">
  </div>
</div>

<div ui-view="events"></div>
<div ui-view="speakers"></div>
<div ui-view="favorites"></div>

#2

Were you able to solve this?
I’m facing the same issue!