Question

我想用Meteor模板填充script type="text/html标签。

所以，我知道这是一件奇怪的事情。我想这样做的一半原因是因为Cloud9无法区分JS脚本标记和HTML脚本标记之间的区别，当您尝试在script标记中编写HTML时，它的语法突出显示和标记完成会中断。我的另一半只是好奇，看看这是否可行，因为存在一种丑恶的解决方法。

所以这个：

<body>
    <script type="text/html" id="test">
        {{> test}}
    </script>
</body>

<template name="test">
    <span>Test</span>
</template>

产生这个：

<script type="text/html" id="test">
    <!--label:YRgyaMH8-->
</script>

任何人都有办法强制它渲染模板，而不是将名称评估为评论吗？

Answer 1

提交另一个答案b / c我想保留我以前的答案只是为了记录。我认为这种方法会更好。

在你的html中，你将定义两个部分。第一个是你要放置模板代码的地方。它会进入一个普通div标签内的注释。第二个是放置模板以供Knockout使用的地方。它看起来像这样：

<template name="koTemplate">
    <div id="myTemplate">
        <span>Here is my template <a href="#">with children</a></span>
    </div>

    <script type="text/html" id="test"></script>
</template>

然后在您的客户端JS代码中，您将添加a callback to run when the template is rendered

Template.koTemplate.rendered = function () {
  // Get the first node, then get the content inside of it
  var templateHtml = this.firstNode.innerHTML;

  // Remove the element so it doesn't get rendered
  this.firstNode.parentNode.removeChild(this.firstNode);
  // another option is to surround the contents inside the template w/comments, but that loses syntax highlighting

  // Get the target node for placing the template in
  var templateNode = this.lastNode;

  // place the content from the original node to the target node
  templateNode.innerHTML = templateHtml;
};

这将基本上获取模板的内容，删除模板，然后将其放在脚本标记内。结果如下：

<script type="text/html" id="test">
    <span>Here is my template <a href="#">with children</a></span>
</script>

Answer 2

我建议不要使用脚本标记，而是使用Cloud9不会将其视为JS和Meteor不会捏造的其他通用标记。使用我对该问题的评论中的示例，它看起来像这样：

<div id="template">
  <!--<span>test</span>-->
</div>

在你的JS中，你会解析：

var template = document.getElementById('template').firstChild.nodeValue,
    result = parseTemplate(template, values);

这是基本的想法。获得结果后，您必须将其转换为Knockout的模板解析。

脚本标签里面的流星模板

2 个答案: