[BUG] Nested query params don't work with refresh model

[EWhite613]

If you have

queryParams: {
  'nested.foo': {
    // By default, controller query param properties don't
    // cause a full transition when they are changed, but
    // rather only cause the URL to update. Setting
    // `refreshModel` to true will cause an "in-place"
    // transition to occur, whereby the model hooks for
    // this route (and any child routes) will re-fire, allowing
    // you to reload models (e.g., from the server) using the
    // updated query param values.
    refreshModel: true,

    // By default, the query param URL key is the same name as
    // the controller property name. Use `as` to specify a
    // different URL key.
    as: 'foobar'
  }
},

_optionsForQueryParam fails to work because it uses get(this, queryParams.${qp.urlKey}) when really the vaule is queryParams[qp.urlKey]. Same idea for props.

So with the current implementation of _optionsForQueryParam the nested query param doesn't work. And as a consequence when QPs change the Route can't determine if that QP is marked as refreshModel.

Example (with rudimentary fix):

https://ember-twiddle.com/0a1917cff72d5720d69e0382276e6722?openFiles=routes.application.js%2C

[jelhan]

Maybe I'm missing something but the issue isn't the nested query param but that the name of the query param contains a dot, isn't it?

let qp.urlKey = 'nested.foo';
get(this, `queryParams.${qp.urlKey}`);

is the same as

get(this, 'queryParams.nested.foo');

and

let queryParams = get(this, 'queryParams');
get(queryParams, 'nested.foo');

In all cases nested.foo is treated as a path and not as a property name.

Are you trying to bind the value of an object (e.g. service) to a query param? If that's the case I would recommend to create an alias and use that one.

[EWhite613]

@jelhan the query param is correct in it being a path to a property on a controller.

Controller = {
queryParams: ['nested.foo'],
nested: {
  foo: 'foobar'
}
}

That's all fine. The problem is when it reaches the route.

queryParams: {
  'nested.foo': {
    refreshModel: true,
    as: 'foobar'
  }
},

The function _optionsForQueryParam never works because it also assumes a path when pass nested.foo. Even though you have to list it as nested.foo to work.

Switching to use an alias would work, but that's basically a workaround rather than a fix