把手幫手模板組合物

Question

我有車把幫手來調用模板內模板，

的使用是這樣的：

ApplyTemplate在subTemplateId ARG1 = 123 ARG2 = 「ABC」 ...

也可以通過HTML內容

{{# applyTemplate "tli" a=1 b="y"}} 
    ... any content here will get passed to the sub template with {{content}} 
    {{/ applyTemplate }} 

這說明的jsfiddle它是如何工作的：http://jsfiddle.net/maxl/ywUjj/

我的問題：我想在呼叫範圍內的變量是在子templemplate訪問 ，在的jsfiddle，注意{{topLevelVar}} 如何不可用。

感謝

Answer 1

從這個例子中，我會說，你可以使用Fn以訪問上下文中的helper方法 http://yehudakatz.com/2010/09/09/announcing-handlebars-js/

applyTemplate: function(context, fn) { 
    for(var i=0, j=context.length; i < j; i++) { 
     buffer.push(fn(context[i])) 
    } 
} 

其中，fn內的「模板」部分，和上下文模型被應用到它。

Answer 2

從http://jsfiddle.net/dain/NRjUb/的解決方案開始，我們可以達到同樣的效果，但與內聯模板爲：

<script id="topLevel" type="text/x-handlebars-template"> 
    {{# defTpl "test1"}} 
    La plantilla <b>diu</b> {{part}},{{../topLevelVar}} 
    {{/ defTpl }} 
    {{# each sub }} 
    Iplant-->{{eTpl "test1" part=this}}--fi plant<br> 
    {{/each}}  
</script> 

和註冊車把助手，如：

(function() 
{ 
    var h={}; 

Handlebars.registerHelper('defTpl', function(name, context){ 
    // the subtemplate definition is already compiled in context.fn, we store this 
    h[name]=context.fn; 
    return ""; 
}); 

// block level /inline helper 
Handlebars.registerHelper('eTpl', function(name, context){ 
    if (!h[name]) return "Error , template not found"+name; 
    var subTemplate = h[name]; 
    //if this isn't a block template , the function to render inner content doesn't exists 
    var innerContent = context.fn?context.fn(this):""; 
    var subTemplateArgs = $.extend({}, context.hash, {content: new Handlebars.SafeString(innerContent)}); 

    return new Handlebars.SafeString(subTemplate(subTemplateArgs)) 
}); 


})(); 

並與調用此：

var _template = Handlebars.compile($('#topLevel').html()); 
$('body').append(_template({topLevelVar:123, content:"cascading",sub:[45,30,12]})); 

希望這會有所幫助:)

Answer 3

在topLevelVar之前添加「../」以訪問父上下文。

例如： {{../topLevelVar}}

<script id="tli" type="text/x-handlebars-template"> 
    <tr><td>{{a}}----> {{content}} <----- {{b}}</td></tr> 
</script> 

<script id="zaza" type="text/x-handlebars-template"> 
    <table> 
     {{# applyTemplate "tli" a=1 b="y"}}<input type="text" value='a'>{{../topLevelVar}}{{/ applyTemplate }} 
    {{# applyTemplate "tli" a=2 b="z"}}<input type="text" value='b'>{{/ applyTemplate }}  
    </table> 
</script>