预编译 jsrender 模板答案

【问题标题】：pre-compiling jsrender templates预编译 jsrender 模板
【发布时间】：2012-10-27 18:52:26
【问题描述】：

我有几个用于所有页面的 jsRender 模板。我宁愿不使用脚本标记方法，而是预编译它们并将生成的函数放在外部 js 文件中。

我看到一个previous question 提出这个问题，但所描述的方法似乎不再有效，或者我做错了什么。

我从控制台调用了 $.templates("#myTemplate")，msanjay 建议并复制/重命名了匿名函数，得到了类似这样的东西（我未经训练的眼睛看起来有点奇怪）：

function myTemplate(data, view, j, b, u) {
    var j = j || jQuery.views, h = j.converters.html, ret; try {

        return "<div...";

    } catch (e) { return j._err(e); }
}

如果我尝试通过调用 var html = $.render(data, myTemplate); 来使用这个模板我收到一个错误：

未捕获的类型错误：对象函数 (a,b){return new p.fn.init(a,b,c)} 的属性“渲染”不是函数

不确定 jsRender 是否已更改并且不再可能，或者我做错了什么，但我们将不胜感激。

【问题讨论】：

看起来您的 jsRender 文件未正确包含。换句话说，$.render 似乎不是一个函数。总是最好提供演示，例如使用 jsFiddle。

标签： javascript jquery jsrender

【解决方案1】：

上次更新有很多 API 更改。看起来 $.render 现在只是 empty object。

看看这个页面Provide a tool for pre-compiling templates，你会发现这个演示：JsRender: Variants and Details

例如你可以试试这个：

var movies = [
    { name: "The Red Violin", releaseYear: "1998" },
    { name: "Eyes Wide Shut", releaseYear: "1999" },
    { name: "The Inheritance", releaseYear: "1976" }
];

var myTemplate = $.templates( "<div>{{:#index+1}}: <b>{{>name}}</b> ({{>releaseYear}})</div>" );
$("#movieList").html(myTemplate.render( movies));

演示：http://jsfiddle.net/76nMC/

【讨论】：

【解决方案2】：

compiling templates from strings 可能会得到你想要的。简而言之，它看起来像这样：

$.templates({
    myTemplateName: " blah blah {{>something}} blah "
});

var tempHtml = $.render.myTemplateName(myData);

我意识到您可能会坚持使用预编译模板的概念，认为这样可以节省一些执行时间，但根据我的经验，jsrender 速度如此之快，我从未注意到它。

【讨论】：