Angular UI-Router resetting querystring params on reload

Question

I currently have a state that looks like this:

.state('test-event-list', {
    parent: 'private',
    url: '/test-events?search&sortc&sortd&pagesize&page&select&status',
    reloadOnSearch: false,
    views: {
        'view@body': {
            templateUrl: 'app/config-test/test-event/list.html',
            controller: require('./config-test/test-event/list')
        }
    },
    data: {
        auth: true
    }
})

I am using $location.search() to set the different parameters such as sorting, list size and list page in the querystring.

So for example, the URL could look like this:

/test-events?pagesize=25&page=1

I have a menu that has the following link to select the tests event list:

<a ui-sref="test-event-list" ui-sref-opts="{reload: true, inherit: false}">Tests</a>

While in the state "test-event-list", clicking this link, does partly what I want: reset the list's parameters and reload the page. But what it's not doing is remove the params from the query string.

How could I go about removing "?pagesize=25&page=1" from the URL?

The inherit flag provided by ui-router doesn't seem to be doing much. I am using the latest version of ui-router (0.2.15).

Answer 1

You could try to go:

<a ui-sref="test-event-list({})" ui-sref-opts="{reload: true, inherit: false}">Tests</a>

because query strings parameters are not mandatory

Answer 2

I had this same issue where I just wanted to remove the query from the end of the URL. I was able to remove the query by passing an empty string for each param. It would look something like this for you.

<a ui-sref="test-event-list({ pagesize: '', page: '' })">Tests</a>

For me is was a little different. I didn't need to pass in the current routes name.

<a ui-sref="{ date: '' }">all logs</a>