mardi 10 mai 2016

How to hand off model data to component in Ember 2.x

I have a route in ember which looks like

//fish.js
import Ember from 'ember';

export default Ember.Route.extend({
  model: function(params) {
    return Ember.RSVP.hash({
      fishPrices: this.store.query('fish-price', {filter: {type: params.type}}),
      type: params.type
    });
  }
});

My fish.hbs uses model.type to change text on the page. However, I need to hand model.fishPrices off to a component which plots the price of the fish as a function of time:

//fish-price-plot.js
import Ember from 'ember';
/* global Plotly */

export default Ember.Component.extend({
  didInsertElement() {
    console.log(this.get('model'));
    Plotly.plot( 'fish-price-plot', [{
      // ...
      //Need to access model.fishPrices here
  }
});

How do I access the model in this component? I see a lot of information that suggests that I should be able to do something like

var fishPrices = this.get('model.fishPrices');
//do something with fishPrices

but this always ends up undefined.




Aucun commentaire:

Enregistrer un commentaire