将 html 模板加载到 JavaScript 变量答案

【问题标题】：Load html templates to JavaScript variable将 html 模板加载到 JavaScript 变量
【发布时间】：2015-06-10 13:29:11
【问题描述】：

我将所有 HTML 模板保存到一个文件中。该文件包含大量模板（超过 50 个）。

<script type="text/html" id="template-1">
    <p>Template 1</p>
</script>
<script type="text/html" id="template-2">
    <p>Template 2</p>
</script>

我需要将模板加载到 js 变量中。

我查看了 JQuery 加载方法，但它加载了模板以将其附加到 DOM，这不是我需要的。

任何 JQuery 或 AngularJS 解决方案都适合我。

【问题讨论】：

我的问题是：为什么？我的意思是，它到处都是模板引擎，这是为什么呢？
你为什么要这样做？
我同意，我认为这个问题需要更多上下文才能正确回答。
我不知道你为什么想要这个，但为什么不是 AJAX 调用呢？您可以将变量设置为成功...
@LionC 我假设 create OP 表示渲染，因为需要渲染哪个模板取决于用户的输入/他们不想执行的操作在页面加载时加载所有模板，而不是按需加载。

标签： javascript jquery angularjs

【解决方案1】：

您可以使用 $.get 进行常规 ajax 调用，然后使用 filter 从响应中取出元素（无需将任何内容附加到 DOM）。

例如

 $.get("templateUrl", function (data) {
   var $doc = $(data);
   var firstTemplate= $doc.filter('#template-1').html()
   var secondTemplate e= $doc.filter('#template-2').html()
     //..Load rest of templates into variables
 });

【讨论】：