【问题标题】:handlebars: Passing variable to partial inside each车把:将变量传递给每个内部的部分
【发布时间】:2016-12-01 23:22:53
【问题描述】:

我使用块帮助器 #each 创建了一个列表,但我无法将变量传递给我的每个循环内的部分。

{{#each a-z.letters}}
    {{this}} /*[1]*/
    <li class="list-inline__item">
        {{>button btn="btn-text" addClass='-large' link='letter/{{this}}' label='{{this}}'/*[2]*/}}
    </li>
{{/each}}

链接部分:

<a href="{{link}}" class="btn-text {{addClass}}">{{label}}</a>

输出是:

<ul class="list-inline">
    A /*[1]*/
    <li class="list-inline__item">
        <a href="letter/{{this}}/*[2]*/" class="btn-text -large">{{this}}/*[2]*/</a>
    </li>
    ....

[1] 仅用于测试,它可以工作

[2] 如果我想将它传递到一个部分内部,它不会呈现我的参数

更新

所以这是我现在用 url 扩展我的 href 的助手。

Handlebars.registerHelper('updateLink', function(options){
    var insertAt = "href=";
    var content = options.fn(this).trim();
    var pos = content.indexOf(insertAt) + insertAt.length+1;  // +1 for the quotation marks
    content  = content.slice(0, pos) + options.hash.url + content.slice(pos, content.length);
    return new Handlebars.SafeString(content ); 
});

链接部分:

{{#updateLink url="letters/"}}
    {{>button link=this label=this btn="btn-text" addClass='-large'}} 
{{/updateLink}}

【问题讨论】:

    标签: parameters handlebars.js partials


    【解决方案1】:

    当您已经在一组大括号内时,您不能使用{{}} 大括号语法来评估数据成员。但是,您可以简单地引用该成员,而无需将其括在引号中,它将被评估:

    {{>button btn="btn-text" addClass='-large' link=this label=this}}
    

    您会注意到,我上面的示例不包括 link 值的“字母/”前缀。 Handlebars 无法连接字符串。为此,您可以选择以下选项之一:

    • 使用助手(您自己的或其他人的)。
    • 将前缀作为附加参数传递给您的部分。
    • 硬编码部分模板中的前缀。
    • 在模板数据中包含连接的字符串 (a-z.letters)。

    【讨论】:

      猜你喜欢
      • 2014-06-24
      • 1970-01-01
      • 2016-07-20
      • 2012-07-16
      • 2016-07-21
      • 2013-11-17
      • 2012-09-17
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多