將數據傳遞迴組件

Question

我目前有一個組件的幾個組件。一個是顯示所有我的表格視圖數據的組件，在該組件內部是另一個顯示搜索字段的組件。它們看起來像這樣：

{{#table-display model=model}} 

    <table class="data-table"> 
     <thead> 
     <tr> 
      <th>Status</th> 
      <th>Name</th> 
      <th>Email Address</th> 
     </tr> 
     </thead> 
     <tbody> 
     {{#each filteredModel as |contact| }} 
     {{#link-to 'contacts.edit' contact tagName="tr"}} 
      <td>{{ current-status model=contact }}</td> 
      <td>{{ contact.name }}</td> 
      <td><em>{{ contact.name }}</em></td> 
      <td><em>{{ contact.email }}</em></td> 
     {{/link-to}} 
     {{/each}} 
     </tbody> 
    </table> 

{{/table-display}} 

然後table-display組件裏面，我有我的搜索過濾器輸入。

{{input value=filterString placeholder="Search Contacts" }} 

表篩選工作，如果我把表到table-display成分，但如果它只是在組件中沒有。我在這裏做錯了什麼？

Answer 1

有幾種方法可以讓fitleredModel數據流出組件，慣用的方法是使用HTMLBar阻塞的參數。

在表格內顯示的模板：

... 
{{input value=filterString placeholder="Search Contacts" }} 
... 
{{yield filteredModel}} 

然後在你的主模板：

{{#table-display model=model as |filteredModel|}} 
    ... 
    {{#each filteredModel as |contact|}} 
    ... 
    {{/each}} 
{{/table-display}}