提问者:小点点

如何将模板循环中的索引传递到我的助手中,并让它返回Handlebar表达式


问题源于无法在模板中进行比较:

{{#if model.input.type == 'select'}}

到目前为止,我所知道的这个选项是使用自定义Handlebar助手。这将允许我遍历模型并构建超文本标记语言,但这不允许我绑定属性,而且似乎工作量太大。

1. Can't bind attributes, and I don't want to build out HTML with a JS string.   

Handlebars.registerHelper('formBuilder', function()
{
    var html_string = '';

    for(var q=0; q<this.content.questions.length; q++)
    {
        if(this.content.questions[q].type.match(/select/i))
             { /* build out html with model propeties */ }

        if(this.content.questions[q].type.match(/checkbox|radio/i))
             { /* build out html with model propeties */ }

    }
    return new HandleBars.SafeString(html_string);
}

更好的选择是,如果我可以在我的助手中跟踪索引,并返回一个Handlebar表达式,而不会破坏模板的循环:

        2. Can't pass in loop index or return expressions.

        {{#each question in model.questions}}
            {{#formBuilder parent.index this}}
                /* uses @index to iterate through its children and return a Handlebars 
                   expressions for either select or checkbox html */
            {{/formBuilder}}
        {{/each}}

… formBuilder助手看起来像这样:

Handlebars.registerHelper('formBuilder', function(q_index, model)
{
    if(model[q_index].type == 'select')
    {
        return Handlebars.compile({{select action 'myAction' type='model[q_index].type'}});
    }

    if(model[q_index].type.match(/checkbox|radio/i))
    {
        return Handlebars.compile({{input action 'myAction' type='model[q_index].type'}});
    }

});

WICH将把控制权返回到外环。

这个问题在Ember中是如何解决的?


共1个答案

匿名用户

看看你想更近距离地实现什么,我建议你使用视图而不是车把助手来创建复选框或选择字段。你会这样做的方式是

{{#each question in questions}}
  {{view QuestionView contentBinding=this}}
{{/each}}

在你的问题中,

 App.QuestionView = Em.View.extend({

   defaultTemplate: (function() {
      if(this.get('type') === 'select') {
        return Em.Handlebars.compile(//select box string goes here);
      }
      else {
        return Em.Handlebars.compile(//checkbox html);
      }
   })()
 });