How does one observe changing query parameters in Ember?

Question

How does one observe multiple query parameters in Ember.js, using query-params-new, without explicitly listing each one in observes(), or property().

Let's say I have the following list of query parameters:

queryParams: [
    'first',
    'second',
    'third',
    'fourth',
    'fifth',
    'sixth',
    'seventh',
    'eighth',
    'ninth',
    'tenth'
],

first: null,
second: null,
third: null,
fourth: null,
fifth: null,
sixth: null,
seventh: null,
eighth: null,
ninth: null,
tenth: null

I would like to have a method in the controller that observes all of these properties, but without having to list them, eg:

something: function() {
    ...
}.property('first', 'second', 'third', ...)

---

Edit:

I looped through the queryParams array, and set an observer for each of them, on the corresponding property, like so:

init: function () {
    this._super();
    var queryParams = this.get('queryParams');
    var self = this;
    queryParams.forEach(function (param) {
        self.addObserver(param, self, 'updateSelectedOptionsIfQueryParamsChange');
    });
},

It's working as intended. Is there a better way to do this, or is this correct?

Answer 1

When a query param changes the action queryParamsDidChange is fired. This can be used in the controller or route to trigger what ever logic you need to run whenever a query param changes.

Example:

App.ApplicationRoute = Ember.Route.extend({
  actions: {
    queryParamsDidChange: function() {
      // do some funky stuff
    }
  }
});

Example jsbin from the PR