I am quite new to ember and don't really get the difference between two types of syntax. Where and in which situations should i use one or another. I.e. Which one is more suitable for usage in Routes and which one for Controllers.
this.get('model')
As opposed to
this.modelFor('artists/show')
this.get('model') //controller call
this.modelFor('someRoute') //route call
In Ember, a routes setupController hook by default performs this one line of code:
setupController: function(controller, model){
controller.set('model', model);
}
This takes whatever is returned from the model hook and sets the controller's model property with this value. From within the controller, this.get('model') is the proper way to access this model. Also, a developer can override this hook and do something different, like set model equal to some child property of what is returned from the model hook (controller.set('model', model.prop). This is worth noting, because when you call this.modelFor from another route, you DO NOT get the route's associated controller's model that is set by setupController. You get whatever is returned from the model hook, which under the covers is the route's currentModel property if I remember correctly.
this.get('model') fetches the model from the current controller scope.
this.modelFor('artists/show') fetches the model that would be in scope at the specified route.
this.get('model') would be used in the controller in a computed property, say.
this.modelFor is for a route to access the model of a parent route say to reuse or resolve to it.
This two are defined on different ember objects - model property on controller and modelFor method on route.
First of all, the model property, and executing it as this.get('model') only gets the object that is already set on the model property in controller. It means, that it gets anything that was set up during the setupController hook in route. You cannot fetch any data from API using this statement. Moreover, it allows you only to get the object that was set on current controller (this scope).
In setupController hook. The life-cycle of route first resolves all model-related callbacks (beforeModel, model and afterModel). After that, it executes setupController with these arguments: (controller, model). It means that it has access to all that resolved from model hook and the current controller instance. By default, the setupController sets the model on controller.model property:
controller.set('model', model);
You can override that with your custom code and e.g. set your model on myModel property - it depends on you. But if you want to get your model in your controller code, you have to always query the property you set your model on.
modelFor is defined on routes instances and allows you to get the model hook result from any route in your application. You can use it in your setupController hook as follows:
controller.set('model', this.modelFor('myOtherRoute'));
This behaviour can be considered as improving consistency across the app - it explicitly says that in current route and controller you use the same data as in myOtherRoute.
How does it work? It queries myOtherRoute.model property, that stores the model resolved data of that route. The implementation is fairly simple - it looks up your container (global object that stores your routes, controllers, components, etc.) for the route named myOtherRoute and gets it model property.
