Question

我正在尝试从旧的jQuery tmpl升级到这个很棒的新jsRender。

我的代码已经可以使用了。

我正在根据后端返回的JSON构建带有模板的FORM。

对象是：

var form = {
  name: "addNew",
  fields: [{type: "text", name: "Age"}, {type: "hidden", name: "Id"}] 
};

在旧的jQuery插件中，我确实是这样

'{{tmpl(this.data) selectInputTemplate( this.data )}}'

函数selectInputTemplate（）将根据字段类型返回模板名称。

这在新的jsRender中如何工作？

编辑：

如何访问整个对象？在旧的jQuery模板中， this.data 是带有的。

我创建了一个帮助器函数以将模板返回给我，但是我需要知道如何访问整个对象以将其发送给帮助器。

编辑2：

这很难看，但是可以正常工作：

var form_field_wrap =
    "{{if type === 1 tmpl='form_field_input_text' /}}" +
    "{{if type === 2 tmpl='form_field_input_select' /}}" +
    "{{if type === 3 tmpl='form_field_input_checkbox' /}}" +
    "{{if type === 4 tmpl='form_field_input_radios' /}}" +
    "";

Answer 1

在模板中，您可以使用#data访问整个上下文数据对象。

（请参见Paths and expressions）

在辅助函数中，this对象通常是当前的view对象，因此您可以将数据对象作为this.data。

下面是显示上述两种方法的示例：

<script id="myTmpl" type="text/x-jsrender">
    {{include tmpl=~getTmpl(#data)/}}
</script>

<div id="page"></div>

<script>
    var myTmpl = $.templates("#myTmpl"),
        data = { name: "Jo" },
        helpers = {
            getTmpl: function(data) {
                return $.templates("{{: 123}}" + data.name + this.data.name);
            }
        },
        html = myTmpl.render(data, helpers);
    $("#page").html(html);
</script>

顺便说一句，您可以使用{{if}}这样的标签编写示例

"{{if type === 1 tmpl='form_field_input_text'}}" +
"{{else type === 2 tmpl='form_field_input_select'}}" +
"{{else type === 3 tmpl='form_field_input_checkbox'}}" +
"{{else type === 4 tmpl='form_field_input_radios'}}" +
"{{/if}}"

如何根据属性选择要呈现的模板

1 个答案: