I found a jsbin that illustrates my problem. http://emberjs.jsbin.com/ucanam/2708.
That last link, where there are no explicit query-params set on the link-to, it uses the current sticky query param value on the controller. It there a way to turn this sticky feature off? Would doing so break other scenarios?
My current solution is to null out query params on every route I want cleared:
export default Ember.Route.extend({
deactivate: function() {
var controller = this.controllerFor(this.get('controllerName'));
var queryParams = controller.get('queryParams');
for (var i = 0; i < queryParams.length; i++)
controller.set(queryParams[i], null);
}
});
This works but it seems like there should be an easier way.
I should note that doing something like {{#link-to 'route' (query-params val=null)}}{{/link-to}}
for every route is not an option because I have some reusable code where the route is a variable, so I won't know the query params I have to null out.
Here is the proper way to do it, in case the doc's from the answer change:
export default Ember.Route.extend({
resetController: function(controller, isExiting) {
if (isExiting) {
var queryParams = controller.get('queryParams');
for (var i = 0; i < queryParams.length; i++)
controller.set(queryParams[i], null);
}
}
});
It's now very easy to do this via this addon https://github.com/kellyselden/ember-query-params-reset. It also resets to the original values, not just nulling out values.
By default, query param values in Ember are "sticky", in that if you make changes to a query param and then leave and re-enter the route, the new value of that query param will be preserved (rather than reset to its default).
Query parameters are optional key-value pairs that appear to the right of the ? in a URL. For example, the following URL has two query params, sort and page, with respective values ASC and 2:
If you have a category query param and you want it to trigger a model refresh, you can set it as follows: By default, Ember will use pushState to update the URL in the address bar in response to a controller query param property change.
When a controller's query param property is currently set to its default value, this value won't be serialized into the URL. So in the above example, if page is 1, the URL might look like /articles , but once someone sets the controller's page value to 2, the URL will become /articles?page=2.
It gives you two options for how to handle this in the guides: https://guides.emberjs.com/release/routing/query-params/#toc_sticky-query-param-values
Looks like option #2 is pretty close to what you are doing:
use the Route.resetController hook to set query param values back to their defaults before exiting the route or changing the route's model.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With