Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to access query parameters from route in Ember 1.7

Tags:

ember.js

In 1.7 Ember should support Query Parameters. I have no problems using them in controller but I'd like to access them in Route, ideally in beforeModel hook but model hook would work as well.

The API docs mention a queryParam parameter for the beforeModel hook but if I try to use it, it is always undefined.

The Query Parameters guide seems to suggest that the query parameters should be accessible as a part of the first parameter to the model hook. But that is also undefined. See the code below for examples.

Is there a way to access the query parameters from Route?

Thank you for your help.

App.ApplicationRoute = Em.Route.extend({
   beforeModel: function(transition, queryParams){
       console.log(queryParams.test); //undefined at /?test=123
   },
   model: function(params){
       console.log(params.test); //undefined at /?test=123
   }
}); 
like image 982
jancervinka Avatar asked Sep 19 '14 20:09

jancervinka


People also ask

How do I find Route parameters and query strings?

import ActivatedRoute from '@angular/router'. Inject ActivatedRoute class in constructor. Access queryParams property of ActivatedRoute class which returns an observable of the query parameters that are available in the current URL route.

How do I pass a query param on a map?

Create new map and put there parameters you need: Map<String, String> params = new HashMap<>(); params. put("param1", "value1"); params. put("param2", "value2");

How do I get the URL query parameters in react?

Using React Router, when you want to create a Route that uses a URL parameter, you do so by including a : in front of the value you pass to Route 's path prop. Finally, to access the value of the URL parameter from inside of the component that is rendered by React Router, you can use React Router's useParams Hook.


3 Answers

Pretty sure it's a bug, but you can access them in the meantime via the transition object:

App.ApplicationRoute = Em.Route.extend({
   beforeModel: function(transition){
       console.log(transition.queryParams.test);
   }
}
like image 182
typeoneerror Avatar answered Oct 25 '22 05:10

typeoneerror


By specifying the query params in the controller, params will contain them automatically

ApplicationController = Ember.Controller.extend({
  queryParams: ['test'],
  test: null
});
like image 33
Ramy Ben Aroya Avatar answered Oct 25 '22 06:10

Ramy Ben Aroya


In the latest version of ember (2.12 at the time of writing this answer), queryParams can be accessed in the model hook as follows:

import Ember from 'ember';

export default Ember.Route.extend({
    queryParams: {
        test: ''
    },
    model(params) {
        console.log(params.test);
    },
});

Observe that now both dynamic segment and queryParams are accessible via the params object. Since params is not available in the beforeModel hook, this solution works on when you have to access the queryParams in the model hook.

like image 36
vantony Avatar answered Oct 25 '22 07:10

vantony