Javascript模板语言相反

Question

有没有像模板引擎(la Mustache.js)可以在"反向"模板化？

这意味着我提供了渲染的html和模板文件,通过引擎运行它,并从中获取数据(比如JSON结构).

我意识到这是可以通过"屏幕抓取库"完成的事情,但我从未见过使用胡须样式模板的屏幕抓取库(无论那些被称为).

Answer 1

通用解决方案不存在.例如,你永远不能反转以下模板:{{foo}} {{bar}},因为无法找到第一个胡须停止的位置和第二个胡须开始的位置.

例如:

html: 'hello world!'
template: '{{foo}}{{bar}}'
model: {
    foo: '',
    bar: 'hello world!'
}
model2: {
    foo: 'hello world!',
    bar: ''
}

model和model2都从模板中呈现完全相同的html,因此它们都是有效的反转.

但是,如果您为模板制定了一些规则,则可以毫不含糊地执行此操作.

规则:

1. 两个胡子永远不会碰(如上所述).
2. 小胡子内容的开头永远不能与小胡子之后的第一个文字部分相同(或者我们找不到小胡子的末尾).
3. 部分中的第一个文本部分不能与部分之后的第一个文本部分相同(或者我们找不到该部分的结尾).
4. 最好不要使用richtext {{{}}}小胡子(它允许包含任何内容,因此反向匹配意味着它可以匹配文档的其余部分).

这些规则似乎对明文非常严格,但对于xml和html,它们工作得很好(如果你只对元素和属性内容感兴趣).如果您仅使用明文{{}}胡须,则规则二绝不是问题.

例如,可以颠倒以下模板而不会产生任何歧义:

<div>
    <p>{{title}}</p>
    <ul>
        {{#list}}
            <li>{{item}}</li>
        {{/list}}
    </ul>
</div>

但是在</ ul>之前添加另一个<li>会使模板不明确(规则3).

我没有找到任何在线代码,所以我已经开始为此编写一个库.但到目前为止还没有完成,每次我都在努力,我发现了新的局限.只有真正简单的模板才能正常工作(我允许的唯一必须是{{}},{{#}}和{{/}}).

我找到了使用另一个模板系统的解决方案:https://github.com/fabiomcosta/mootools-meio-template/tree/master.它似乎有同样的局限性.