Joe82
Joe82

Reputation: 1251

AngularJS - Ui-router - Redirecting from root state automatically

I would like simply to redirect from / to /shop each one somebody types the root. I tried with $state.go in the controller, but it didn't do the trick. I would like to do it without $urlRouterProvider.otherwise (as there are also urls without routing in my web). Any ideas how to do that? Thanks in advance!

 app.config(function($stateProvider, $urlRouterProvider) {
 $stateProvider.state('root', {
     url: "/",
     controller: {
         function() {
             $state.go('shop')
         }
     }
 }).state('shop', {
     url: "/shop",
     controller: 'myCtrl',
     templateUrl: "/shopcontent.jsp"
 })
});

Upvotes: 0

Views: 2267

Answers (3)

Michael G
Michael G

Reputation: 6755

Check out the redirectTo state definition property.

From the ui-router documentation:

Synchronously or asynchronously redirects Transitions to a different state/params

If this property is defined, a Transition directly to this state will be redirected based on the property's value.

https://ui-router.github.io/ng1/docs/latest/interfaces/state.statedeclaration.html#redirectto

Example:

.state('root', {
      url: "/",
      redirectTo: "shop"  
})

Full working example: here.

If you want any unknown route to redirect to /shop, you could use the following:

$urlRouterProvider.otherwise('/shop');

Upvotes: 1

Lotus91
Lotus91

Reputation: 1125

Your controller should be as below :

 controller: function($state) {
               if ($state.current.name == 'root') { 
                  $state.go('shop'); 
               }
             }

You need to inject the $state inside your controller function.

Upvotes: 2

Valter
Valter

Reputation: 2899

Try this:

On your run function add a listener to the $stateChangeStart so everything the state changes, it will check if it is root then will change to shop:

        .run(["$injector", "$rootScope",
                    function($injector, $rootScop) {
                        $rootScope.$state = $injector.get("$state");
                          //-----Track State Change for request Token -------------
                        $rootScope.$stateChangeStart = [];
                        $rootScope.$on("$stateChangeStart",
                            function(event, toState, toParams, fromState, fromParams) {
                                if (fromState.name == "root") {
                                   $state.go('shop')
                               }
                                $rootScope.$stateChangeStart.push({
                                    toState: toState,
                                    toParams: toParams,
                                    fromState: fromState,
                                    fromParams: fromParams
                                });
                            });
                    }
                ]);

Upvotes: 0

Related Questions