18

How to use $state.go() if I have just the URL ?

Or can I get a state based on URL? (and than use $state.go(state))

I'm asking because I had to intercept the $urlRouterProvider.otherwise() to wait for an other plugin loads some external modules.. and now I need to continue and call the URL that call otherwise()

4 Answers 4

11

In place of $state.go(), you can use $location service as well.

i.e.

$location.path(url)

Please take care of not using # in URL. You can also use window.location.href

Sign up to request clarification or add additional context in comments.

6 Comments

yes, but nothing happens. Maybe because the URL already is the URL in $location.path() argument
URL already in url means? You trying to reload the current state/url?
Yes, here I described the full problem
Try this $state.go($state.current, $state.$current.params, { reload: true})
I'm using a function in $urlRouterProvider.otherwise() and returned true to angular ui-router don't redirect.. then, after all loads, I need to reload the actual URL... but I don't have a valid $state right now
|
2

I had a similar problem, and $location wasn't helping, so I wrote a function to get the state from the url.

NB: I am using nested states based on ui-router.stateHelper, so I traverse my nested states object, testing for url matches. It would be slightly different when using dot notation to define nested states - and even easier if you don't use nested states at all!

function goPath (path) {
    var target;

    var arr = path.match(/\/\w+/g);
    var i = 0;

    var testState = function (state, i) {
        if (state.url === arr[i]) {
            target = state;
            if (state.children && state.children.length && arr.length > i+1) {
                i++;
                state.children.forEach( function (childState) {
                    testState(childState, i);
                });
            } 
        }
    };

    myStatesObj.forEach( function (state) {
        testState(state, i);
    });

    $state.go(target.name);
};

Comments

1

I was on a similar situation, what I did is changed the location to a different path and reset it to the current after a timeout like this

var path = $location.path();
$location.path("/");

$timeout(function(){
    $location.path(path).replace(); //use .replace() so the empty path won't go to the history
},0);

1 Comment

i need to reload the page after redirecting to page. how to do it in ui-router. i have already tried $state.go('dashboard.places.list', {}, { reload: true}); it is redirecting to the particular view , but not reloads
0

i'm adding a full answer to this due to the high number of views.

NOTE: location.search() is only used where you need to handle a URL with a query string in it. otherwise use location.path() only.

your ui.router login state should look something like ...

.state('login', {
    url: '/login',
    templateUrl: 'routes/login/login.html',
    controller: 'LoginController',
    controllerAs: 'loginCtrl',
    authenticate: false,
    params: {
        fwdPath: undefined, // Location to forward to on login success
        fwdQueryStringObject: undefined // Query string object to use on login success - retrieved from $location.search()
    }
})

your 401 (unauthorised) interceptor should look something like ...

state.go('login', {fwdPath: location.path(), fwdQueryStringObject: location.search()});

your login controllers login function should call your login service's login function. the code INSIDE the controllers login function should look something like ...

loginService.login(self.username, self.password).then(function (response) {
    // local vars prevent unit test failure
    var fwdPath = state.params.fwdPath;
    var fwdQueryStringObject = state.params.fwdQueryStringObject;

    if (response.status === 200) {
        timeout(function () {
            if (fwdPath != null) {
                location.path(fwdPath).search(fwdQueryStringObject);
                location.replace();
            } else {
                state.go('home');
            }
        }, 400);
    } else {
        self.error = true;
    }
    self.pending = false;
  }
};

and finally your unit tests ...

state.params.fwdPath = '/login/list';
state.params.fwdQueryStringObject = {q: 5};
spyOn(location, 'path').and.callThrough();
spyOn(location, 'search').and.callThrough();
...
expect(location.path).toHaveBeenCalledWith('/login/list');
expect(location.search).toHaveBeenCalledWith({q: 5});

2 Comments

i need to reload the page after redirecting to page. how to do it in ui-router. i have already tried $state.go('dashboard.places.list', {}, { reload: true}); it is redirecting to the particular view , but not reloads
the whole amazing thing behind state.go is that it does not reload - if you want to reload then just use the $window service .... $window.location.href = '/index.html';

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.