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';

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.