Venkat
Venkat

Reputation: 311

Changing UI router state by updating location.path when base href is present

The app I am working have a base href

<base href="/xyz/">

and the state config looks similar to

.state('state1', {
        url: '/abc/:def/:ghi',
        views: 'view1',
    })
    .state('state2', {
   url:'/abc/:def/:ghi/jk/:123/:456',
        views: 'view2',
    })

and to get the current URL I am doing

var browserUrl = $state.href($state.current.name, $state.params, { absolute: false });

this return me

/xyz/abc/:def/:ghi

I don't have a problem when I do $state.go to goto state2 but if I use $location.path to update the URL then UI router is unable to match the state since the base href is present in the newUrl. To update the state I am doing

var 123Id = 'item1'                                                               
var 456Id = 'item2'
var newUrl = [browserUrl, 'jk', 123Id, 456Id].join('/');
$location.path(newUrl) 

this is not working since the browesrUrl contains the base href, any idea how to make this working by updating the location ?

Upvotes: 1

Views: 240

Answers (1)

lin
lin

Reputation: 18392

An easy workaround would be to use $location.url()instead of $location.path(). url() is able to handle absolute URLs in that way you could generate a absolute URL like:

var browserUrl = $state.href($state.current.name, $state.params, { absolute: true });
$location.url(browserUrl);

Upvotes: 1

Related Questions