典型不爽模板收集

limu commented 11 years ago

大家觉得mustache不太够用，请有意识的收集下mustache力不从心的地方，请写出数据输入和HTML输出，再配上大家觉得别扭的数据处理和模板等。

cyjake commented 11 years ago

其实用得还挺开心的…… 举个栗子，我可以利用 partials 做递归：

var tmpl = '{{#legos}}{{>lego}}{{/legos}}'
var partials = {
    lego: '' +
        '<a href="javascript:void(0)"><i class="iconfont">&#{{icon}};</i>{{name}}</a>' +
        '<div class="children">{{#children}}{{>lego}}{{/children}}</div>'
var data = {
    legos: [{
        name: 'foo',
        icon: 817,
        children: [{
            name: 'foo-child1',
            icon: 831
        }, {
            name: 'foo-child2',
            icon: 237
        }]
    }]
}
mustache.render(tmpl, data, partials)

不爽的例子自然也不少，比如有的时候好想遍历数组的时候取到那个索引值，顺便给它 +1：

{{#users}}{{__index__ + 1}}{{/users}}

另外，下边这种数据尽管很直观，但没法用 mustache 渲染：

var fonts = {
    simsun: '宋体',
    heiti: '黑体'
}

想要这样的结果的话：

<select>
    <option value="simsun">宋体</option>
    <option value="heiti">黑体</option>
</select>

只能改成：

var data = [{
    key: 'simsun',
    label: '宋体'
}, {
    key: 'heiti',
    label: '黑体'
}]

然后模板这么写：

{{#fonts}}<option value="{{key}}">{{label}}</option>{{/fonts}}

yiminghe commented 11 years ago

xtemplate 各种需求都能满足的：

http://docs.kissyui.com/docs/html/demo/component/xtemplate/index.html

而且可以自由选择加载

在线编译 compiler+runtime

离线编译 runtime

etaoux / brix

典型不爽模板收集 #42