在自定義Handlebars幫手中使用linkTo

我使用Handlebars幫助器來解析一組對象，並且希望將返回的結果包裹在#linkTo調用中，以便Embers路由器將其撿起。在自定義Handlebars幫手中使用linkTo

這裏是我如何調用它的觀點： {{buildBreadcrumb my_objects}}

這裏是我的幫助是什麼樣子：

Ember.Handlebars.registerHelper 'buildBreadcrumb', (val, opts) -> 
    value = Ember.get(this, val) 
    out = "" 
    value.forEach (group, index) => 
    if value.length - index == 2 
     out += '{{#linkTo group ' + group.name + '}}' 
    if value.length - index == 1 
     out += '{{#linkTo group ' + group.name + '}}' 
    out

以上只是分析了{{#linkTo ...}}的原因是顯而易見的文字字符串。有沒有什麼辦法可以像我想要的那樣解析它？我很清楚，我可以在視圖本身中使用{{#each}}等等，但是由於我的用例，我必須使用助手來構建它。有什麼建議麼？

來源

2013-06-30 John

您可以編寫自定義Handlebars視圖助手。這種觀點可以封裝#each邏輯，而最終的助手看起來大部分與你在這裏的相似。唯一的區別是必須將參數作爲屬性傳遞給View助手。

創建此幫助程序的方法是傳遞View類而不是輔助函數。

App.BreadcrumbView = Ember.View.extend({ 
    templateName: 'breadcrumb', 
    penultimate: function() { 
    var length = this.get('items').length; 
    return this.get('items')[length - 2]; 
    }.property('items'), 
    last: function() { 
    var length = this.get('items').length; 
    return this.get('items')[length - 1]; 
    }.property('items') 
}); 

Ember.Handlebars.helper('breadcrumb', App.BreadcrumbView);

以及相應的模板，

<script type='text/x-handlebars' data-template-name='breadcrumb'> 
    <ul class="breadcrumb"> 
    {{#each item in view.items}} 
     <li>{{#linkTo 'group' item}}{{item.id}}{{/linkTo}} &raquo; 
     </li> 
    {{/each}} 
    </ul>  
</script>

以及App使用助手，

<script type='text/x-handlebars' data-template-name='breadcrumb'> 
    <ul class="breadcrumb"> 
    <li>{{#linkTo 'group' view.penultimate}}{{view.penultimate.id}}{{/linkTo}} &raquo;</li> 
    <li>{{#linkTo 'group' view.last}}{{view.last.id}}{{/linkTo}}</li> 
    </ul>  
</script>

這種方法的好處是綁定自動連接，所以改變項目數據會自動更新麪包屑視圖，保留內部Metamorphing。

這裏是一個jsbin的例子。

來源

2013-06-30 07:12:39

謝謝你付出的努力 - 我欣賞你的答案。然而，我最大的問題是沒有迭代項目並使它們鏈接（正如你演示的那樣，我可以通過一個簡單的#each調用來實現）。我的問題是，我只想顯示數組中的最後兩項，並鏈接到那些 - 我不想完整的麪包屑痕跡（如果這是有道理的）。這就是爲什麼我要檢查上面給出的示例代碼中項目的索引。任何方式與你給的例子做到這一點？ – John

當然，您可以使用指向特定索引項目的計算屬性，然後在模板中使用這些屬性。查看更新的代碼。 –

謝謝！這是完美的。 – John

在自定義Handlebars幫手中使用linkTo

回答

相關問題