0

我正在寻找 Chrome 扩展中支持的某种 JavaScript 模板引擎,最好不要设置“unsafe-eval”。

现在在这里查看其他问题,他们建议在部署之前预编译模板,但这对我不起作用,因为我不允许“用户”动态更改模板(以及通过插件选项)。 .. 这也是为什么我想要一个不需要“unsafe-eval”的模板引擎,因为用户并不意味着能够注入代码。只是制作非常简单的模板,使用来自 JSON 对象的属性。

字符串替换几乎就足够了……但也差不多,还需要一些简单的评估……“就像 x 大于 y 输出 a 否则 b”

我已经使用 doT.js 有一段时间了,它已经足够简单了,所以它的语义与它的语义相近或更简单。

这是 doT 中的简单示例...

<div class="card">
    <header class="header {{= it.type }}">
        <div class="project_id">
            <div class="project">{{= it.project }}</div>
            <div class="id">{{= it.id }}</div>
        </div>
        <div class="title">
            <div class="nooverflow">{{= it.type }}: {{= it.summary }}</div>
        </div>
        <div class="sizeheader_size">
            <div class="sizeheader">RELATIVE SIZE</div>
            <div class="size">{{= it.estimate }}</div>
        </div>
    </header>
    <section class="description">
        <div class="nooverflow">{{= it.description }}</div>
    </section>
    <footer class="footer">
        <div class="hours">
            <span class="marked"></span>
            <span class="{{?? it.days > 1 }}marked{{??}}"></span>
            <span class="{{?? it.days > 2 }}marked{{??}}"></span>
            <span class="{{?? it.days > 3 }}marked{{??}}"></span>
            <span class="{{?? it.days > 4 }}marked{{??}}"></span>
            <span class="{{?? it.days > 5 }}marked{{??}}"></span>
            <span class="{{?? it.days > 6 }}marked{{??}}"></span>
            <span class="{{?? it.days > 7 }}marked{{??}}"></span>
            <span class="{{?? it.days > 8 }}marked{{??}}"></span>
            <span class="{{?? it.days > 9 }}marked{{??}}"></span>
        </div>
        <div class="priorityheader_priority">
            <div class="priorityheader">PRIORITY</div>
            <div class="priority">{{= it.priority }}</div>
        </div>
    </footer>
</div>

如您所见,这不是最复杂的条件...

4

1 回答 1

0

您可以在包含模板和模板引擎的沙盒页面中呈现模板。这是通过将您的数据以消息的形式发送到此沙盒页面来完成的。渲染模板后,沙箱将发送另一条包含渲染模板 html 的消息,该模板可进一步用于内容脚本或弹出窗口。

本文更详细地描述了该过程。您还应该熟悉Chrome 扩展程序中的消息传递

于 2012-11-20T06:31:35.547 回答