javascript - 如何将 Store 注入(inject)我的 ember 组件

Question

我现在的情况是需要将商店注入(inject)到我的组件中，至少我认为这是我的需要。

情况是这样的:

我有组件，代码本身并不重要，但我粘贴它是为了更好地理解:

//components/masonry-plugin.js
import Ember from 'ember';

export default Ember.Component.extend({
  didInsertElement : function(){
    this._super();
    Ember.run.scheduleOnce('afterRender', this, this.afterRenderEvent);
  },

  afterRenderEvent : function(){
    var $grid = this.$('.grid').masonry({
      itemSelector: '.grid-item',
      percentPosition: true,
      columnWidth: '.grid-sizer'
    });
    // layout Isotope after each image loads
    $grid.imagesLoaded().progress( function() {
      $grid.masonry();
    });  
  }
});

这是他自己的模板

<div class="grid">
    <div class="grid-sizer"></div>
    {{#each model}}
        <div class="grid-item">
          <img {{bind-attr src=imgLink}}>
        </div>
     {{/each}}
</div>

此模板由{{masonry-plugin}}导入到另一个模板photography.hbs

问题是，由于在photography.hbs中我可以访问模块imgLink，因为在路由photography.js中我创建了使用Flickr API的模块，我怎样才能使该模块可访问也到 {{masonry-plugin}} 中的模板？

希望解释清楚

这里还有用于澄清的模型 img

var img = DS.Model.extend({
    imgLink: DS.attr('string')
});

Answer 1

组件中只需要一行 inject那里的商店或其他服务:

import Ember from 'ember';
const { service } = Ember.inject;

export default Ember.Component.extend({
    store: service(),
    foo: service('store') // if you dont want to name property same as service
});