如何将jquery mustache应用于外部文件/模板

ej83mcc0  于 2022-11-03  发布在  jQuery
关注(0)|答案(2)|浏览(159)

我使用这个来“获取”我的外部html文件,然后使用mustache附加到该模板的id:

$.get('block.html', function(data) {
        $('#mydiv').append(data);

            var list = {
                       name : 'whatever'  
            };

            $('#Block').mustache(list).appendTo('#mydiv');
    });

文件block.html将如下所示:

<script id="Block" type="x-tmpl-mustache">
My name is {{name}}
</script>

有更好的方法吗?因为,现在,我附加了两次。

0ve6wy6x

0ve6wy6x1#

jquery mustache插件非常适合当前文档中的模板。
但是这里你有一个不同的用例,mustache本身提供的助手就足以完成这项工作。所以,只要:

$.get('block.html', function(template) {
    var view = {name:'whatever'};
    var html = Mustache.to_html(template, view);
    // and now append the html anywhere you like
});

在这种情况下,您的block.html可以变成:

My name is {{name}}
t3psigkw

t3psigkw2#

您可以使用我编写的库Chevron从文件中加载外部模板,如下所示:
在HTML中添加指向模板文件的链接:

<link href="path/to/template.mustache" rel="template" id="templateName"/>

然后,在JS中,你可以这样呈现你的模板:

$("#templateName").Chevron("render", {name: "Slim Shady"}, function(result){
    // do something with 'result'
    // 'result' will contain the result of rendering the template
    // (in this case 'result' will contain: My name is Slim Shady)
});

雪佛龙公司的文档会给予更多的例子

相关问题