user4715853
user4715853

Reputation:

Angularjs - Clearing sticky state in angular ui-router

I am trying to add multiple tabs in my angularjs application. On click of any menu item, I open the view in a new tab.

User have a optin to close any existing tab and he can click the menu option again to opne the view again as a tab.

Till now all this is working fine, but the issue is when the tab is closed I am not able to clear the previous sticky state. When user clicks on the same menu the new view is loading with the previous state.

On the close tab action I am trying to clear the state as following.

 $stickyState.stateInactivated($state.$current)
 $stickyState.reset('tabs.survey')

My routing for the tab is as following.

 $stateProvider.state('tabs.survey', {
        url: '/survey',
        sticky: true,
        views: {
            'survey': {
                templateUrl: 'partials/survey.html',
                controller : 'surveyController'
            }
        }
    });

Upvotes: 2

Views: 944

Answers (1)

user4715853
user4715853

Reputation:

I applied a workaround/hack to fix this issue

I added a new parameter to the route as following.

 $stateProvider.state('tabs.survey', {
        url: '/survey/:ts',
        sticky: true,
        views: {
            'survey': {
                templateUrl: 'partials/survey.html',
                controller: 'surveyController'
            }
        }
    });

Added the module run configruation like following.

app.run(function ($state, $rootScope, $stateParams) {
    $rootScope.$state = $state;
    $rootScope.$stateParams = $stateParams;
})

Finally on creating of a new tab item, I tried to changed the parameter to refresh the old state as following.

 $state.go('tabs.survey', { "ts": 1 });
  $state.go('tabs.survey', { "ts": 0 });

This is just a workaround. There can be some better solution for this, which I am not sure at this point of time.

All suggestions are welcome.

Upvotes: 1

Related Questions