サービスから来たコンポーネントにパラメータを渡すEmberjs

Question

私は動的ナビゲーションバーを組み立てようとしています。そのため、すべてのボタンをルートごとに調整する必要があります。

各ボタンは、例えば、非常に単純な部品である：

<!--features/components/button-edit/template.hbs--> 
{{#link-to "accounts.edit" classNames="button is-normal is-outlined is-dark"}} 
    Edit 
{{/link-to}} 

と

//features/components/button-edit/component.js 
export default Ember.Component.extend({ 
    tagName: 'span', 
    classNames: ['nav-item'], 
}); 

Iは、サービス

// features/navigation/service.js 
export default Ember.Service.extend({ 
    visibleOptions: [] 
}); 

、私はどのサービスに渡す各ルート内部を有しますそのルートに表示したいボタン

//features/accounts/view/route.js:4 
export default Ember.Route.extend({ 

    navigationService: Ember.inject.service('navigation'), 

    activate() { 
    this.get('navigationService').set('visibleOptions', ['button-new', 'button-edit']); 
    }, 

}); 

だから私は、フロントエンドでそれらをループ

 {{#each navigationService.visibleOptions as |option|}} 
     {{component option}} 
     {{/each}} 

これがうまく機能し、私が欲しいものを行い、問題は私がボタンコンポーネントにモデルのようなものを渡すことができる方法を見つけ出すことはできませんであることができ。たとえば、編集ボタンにはリンクのmodel.idが必要です。

コンポーネント内でコントローラを一度試してみるとどうでしょうか？どういうわけか？

Answer 1

controllerをcomponentに注入することはできません。あなたはそれを渡す必要があります。あなたは

 {{#each navigationService.visibleOptions as |option|}} 
     {{component option model.id }} 
     {{/each}}