Hello, I have a question which I am currently stumped on regarding a tabbed application which I am developing.
The tabs have their own state, so for example if I interact with the app on tab 1 and display data there, then go to tab 2, then go back to tab 1 the data and scroll position of that tab is persisted when I returned. This is working how I want.
The issue I am running in to is when I recently made a change to update the tabs from ui-sref’s to call a function in a controller, which then uses $state.go, to go to the same state I was pointing to in my ui-srefs. Now, instead of getting to that tab where I left it, I get the default state of that tab, or what the user would see when they first open the app, and not how they left it with regard to scrollposition and the data they were looking at. Here is the relevant code:
tabs -
<script id="tabs.html" type="text/ng-template">
<ion-tabs ng-controller="ContentController" class="tabs-icon-top">
<ion-tab title="Tab1" ng-click="toggleLeft('articles')">
<ion-nav-view name="first-tab"></ion-nav-view>
</ion-tab>
<ion-tab title="Tab2" ng-click="toggleLeft('markets')">
<ion-nav-view name="second-tab"></ion-nav-view>
</ion-tab>
<ion-tab title="Tab3" ng-click="toggleLeft('watchlist')">
<ion-nav-view name="third-tab"></ion-nav-view>
</ion-tab>
</ion-tabs>
</script>
controller -
$scope.toggleLeft = function(tab) {
if(tab) {
switch(tab) {
case 'articles':
$state.go("tabs.headlines");
break;
case 'markets':
$state.go("tabs.marketdata");
break;
case 'watchlist':
$state.go("tabs.watchlist");
break;
}
}
The crux of the issue is replacing my tabs ui-srefs with a ng-click which then uses $state.go, which both point to the exact same state but have different results (ui-sref preserving tab state, while $state.go does not). It was my understanding that these two things should be interchangeable functionality wise. Is this not the case? Or, is there some magic going on behind the scenes with tabs which would cause this to behave differently?
Any feedback would be appreciated!