从客户端隐藏 HTML 模板

Question

我想让我的客户端代码尽可能简洁。我的项目使用 Knockout JS 和这个模板引擎：https://github.com/blueimp/JavaScript-Templates。我已经在我的源代码底部创建了模板，计算值呈现在每个团队板的“pre”部分（我真的不想看到）。有没有办法隐藏模板并在 DOM 加载时调用它？

Answer 1

要从服务器加载您的模板，请将它们放入自己的小 .html 文件中，然后在客户端上，您可以使用 jquery 将它们提取到变量中：

// The variable that we're going to put the template in
var myTemplate;

$.ajax({
      async: false,
      type: "GET",
      url: "/templates/myTemplate.html",
      success : function(data) {
            myTemplate = data;
      }
 });

那么当你想使用模板的时候，你可以用模板调用templ()：

 var result = tmpl(myTemplate, data);

注意：我已经使用 async:false 强制 jquery 同步，因为您想确保调用模板时模板就在那里。