ダイナミックRactiveコンポーネントにデータをフィードする方法は？

Question

JSONブループリントから指定されたRactiveコンポーネントを表示するページを作成しており、正しいデータをコンポーネントに渡すための助けが必要です。

私はコンポーネントにデータを渡す方法を最も単純なケースで理解：

（例えば、<dog theData={{theData}} />）

しかし、この場合には、私はコンポーネントを提供するために、Ractive.extend機能を使用していますループを作成し、各コンポーネントに適切なデータを無駄にするために多くのことを試しました。

このバイオリンはそれを説明する必要があります。「getComponent」機能で https://jsfiddle.net/4kax8dLo/7/

を、私は「これは」「homePageSections」の下で、適切なデータを検索し、コンポーネントにこのデータを供給するために使用する必要があります。

成功した場合、ページは「navTextはイーのHAAである。」と言うべきで

を（これらは、ページ上のものを置くためにovercomplicated方法のように思われる場合、私に知らせて、私がすることができ、詳細なユースケース。そこ目標を達成するためのよりシンプルで洗練された方法かもしれません）。

ガイダンスやアドバイスに感謝します！

Answer 1

コンポーネントがまったく必要ですか？あなたの例から、あなたはちょうど部分（http://docs.ractivejs.org/latest/partials）でうまくいくようです。

これが当てはまる場合、部分的なアプローチで作業するために少し例を修正しました。それらを印刷するための

partials: { 
    dog: '{{#with theData}}<h3>the dog is a <span style="color: {{color}};">{{dogType}}</span> and this works fine</h3>{{/with}}', 
    topHomeNav: '<div>the navText is: {{data.navText}} </div>', 
    heroUnit:'<div><h2>THE HERO TITLE IS:</h2><br />{{data.heroTitle}}</div>', 
    filterResults: '<div>filter results: </div>', 
    pageFooter:'<div>footertext is: {{data.footertext}}</div>' 
} 

あなたのループ：

{{#each homePageData.views[currentView]}} 
{{#with homePageData.homePageSections[this]}} 
    {{> this.partial}} 
{{/with}} 
{{/each}} 

あなたが満足している場合言われて、あなたはおそらくかなりたくさんきれいに見えるようにコードをリファクタリングできることパーシャルを定義 https://jsfiddle.net/cxnhtxLy/

パーシャルはあなたがタスクに必要なものです。

更新日： これはコンポーネントを扱うフィドルです。 https://jsfiddle.net/grkgb0sr/ 詳細については、下記のコメントを参照してください。