/ ember.js-emberjs

Difference between passing object and id to link-to helper for evaluating dynamic segment in ember.

Let's assume we have route in our application:

Router.map(function() {
	this.route('category', { path: '/category/:id' });

This route has dynamic segment. Whenever application will be loaded it will create url as '/category/1' , 'category/2' etc.

What is Dynamic segment?

A dynamic segment is a section of the path for a route which will change based on the content of a page. Dynamic segments are made up of a : followed by an identifier in path.

If user navigates to 'category/5' then it will have category_id '5' to load correct category.

Dynamic Segment

Often, you'll want a template to display data from a model. Loading the appropriate model is one job of a route.


export default Ember.Route.extend({
	model: function(params) {
    return this.store.find('category', params.id); 

Dynamic segment is passed to model hook of corresponding route 'category'. We can use dynamic segment to find and return particular object that can be used in template.

{{link-to 'category' category}}

To create link-to route we use {{link-to}} helper. Last argument category is an object that fills in the dynamic segment for the route, and thus its id becomes the id segment for the route.

The trap that many people fall into is that the model hook is not
called in that case, since the model is already known and has been
passed in.

Workaround for this is to pass in object id not actual object.


{{link-to 'category' category.id}}