ember.js - How to access a routes model in Ember 2 -


i having trouble accessing route's model inside template. model created part of action defined in home controller:

actions: {     createproject: function () {         var project = this.store.createrecord('project', {             name: 'sample name'         });         var self = this;         var promise = project.save();          promise.then(function (response) {             self.transitiontoroute('estimate', project);         });         promise.catch(function (errors) {             console.log(errors);         });     } } 

the model's uuid correctly serialized url, url inside router.js being follows:

  this.route('estimate');   this.route('estimate', { path: '/estimate/:project_id' }); 

my estimate controller correctly specifies project dependency:

import ember 'ember';  export default ember.controller.extend({     needs: ['project'] }); 

...and define model inside routes/estimate.js follows:

import ember 'ember'; import authenticatedroutemixin 'ember-simple-auth/mixins/authenticated-route-mixin';  export default ember.route.extend(authenticatedroutemixin, {     // model: function(params) {     //     return this.store.find('project', params.project_id);     // },     model(params) {         return this.store.findrecord('project', params.project_id);     } }); 

logging output of this.store.findrecord('project', params.project_id) get:

class {__ember1458995391969: null, __ember_meta__: meta} __ember1458995391969 ... 

however when try access project model inside estimate handlebars template (using {{model.project.name}}), nothing (no errors, no output).

anybody have thoughts on this?

the return value of model hook bound model property of controller, binds template under same name.

you should write {{model.name}}, not {{model.project.name}}.

background

your model hook returning ember data promise object directly (which normal). means model refers project object; there no model.project property.

rendering {{model.project.name}} calling this.get('model.project.name') in controller. ember return undefined path, if model.project undefined itself:

> $e.get('model') < class {store: class, isloaded: true, manager: class, isupdating: false, __ember1459002119210: "ember610"…} > $e.get('model.project') < undefined > $e.get('model.project.name') < undefined > $e.get('model.project.name.whatever') < undefined 

so there's no error in case. , nothing shows in template, because null , undefined rendered blank strings.


Comments