Injecting $state (ui-router) causes circular dependency

Question

When i put $state there i get this error...how can i fix it?

I want to use $state to navigate to another page but i dont know how ? Any suggestion ? Is there any other way to navigate user to another page ?

 app.factory('mainAuthInterceptorService', ['$q','$state', '$injector', '$location', 'localStorageService', function ($q,$state, $injector, $location, localStorageService) {....}

im using this

 authService.logOut();

And now i need to redirect user to another page ...

Answer 1

One simple fix would be to use the $injector service to get a reference to the $state service, like so:

    app.factory('mainAuthInterceptorService', ['$q', '$injector', '$location', 'localStorageService',
      function($q, $injector, $location, localStorageService) {
        var $state = $injector.get('$state'); // inject state manually

        ... // your interceptor logic
      }

You can then use the $state object like usual.

There is a similar question created by another user with a great answer that explains the issue in depth: Injecting $state (ui-router) into $http interceptor causes circular dependency