Allow passing null to query-params subexpression

[blimmer]

It would be really great if you could pass null to the query params subexpression in a link-to. Today, if I pass null like this:

{{#link-to 'foo' (query-params test=null)}}...{{/link-to}}

I will end up on the route localhost:4200/foo?test=undefined because the subexpression is expecting null to be a variable it can access in my current context.

A common use case of doing something like this is with clearing a search. Imagine I've implemented a search query parameter and I want to implement an "X" to clear the search. In order to use a link-to and clear the query parameter, I have to put a variable called null in context for the link-to to clear the query param from the address bar.

App.FooController = Ember.Controller.extend({
  queryParams: [q],
  q: null,
  null: null
});

Here's an example JSBin showing the issue I described.

[jbrown]

👍 I've had the same use case in my app.

[mmun]

This needs to be requested upstream at https://github.com/wycats/handlebars.js/issues.

[blimmer]

The (query-params) subexpression is defined in Ember's codebase, are you sure it is an issue for the handlebars repo?

[mmun]

Yes. The Handlebars parser needs support for null and undefined literals.

[mmun]

In the mean time you can probably (awkwardly) define subexpressions to do this.

helpers/null.js: export default function() { return null; }

{{#link-to 'foo' (query-params test=(null))}}...{{/link-to}}

[blimmer]

Thank you for that idea. That workaround is so, so much better than what we're doing now. Here's a JSBin with it in action.

[jfelchner]

I'd also like to weigh in on this that in addition it would be great to be able to pass a simple null into query-params.

The use case for this would be, for example if you had a filter bar with multiple different options (filterA, filterB, filterC, searchQuery, sortDirection, sortField, etc). Typically you want to "clear" these. Currently the way you would do this would be:

{{link-to 'clear' 'whatever' (query-params filterA=<defaultFilterAValue> filterA=<defaultFilterAValue> filterB=<defaultFilterBValue> filterC=<defaultFilterCValue> searchQuery=<defaultSearchQueryValue> sortDirection=<defaultSortDirectionValue> sortField=<defaultSortFieldValue>)}}

Which is uhhhhh verbose.

If we could assign null, then that would help, but you still have to redefine every query param, which is a ton of duplication. And you have to remember that if you add a new one or rename one that you need to go back to the "clear" link (or multiple clear links) and add/change it.

What would be great is if you could instead say:

{{link-to 'clear' 'whatever' (query-params null)}}

And have it know to simply remove all query params from the URL.

[mmun]

@jfelchner I agree that that is verbose but simply unsetting every query param to null might have unintended consequences, especially when reaching for query params not owned by this controller. There is likely a compromise we can find. You should open a new issue to address this, as I'm about to close this one as fixed.

[mmun]

null and undefined literals have been added to HTMLBars so this should be working now. I'm not exactly sure which version but I suspect it was fixed in 1.13.