Question

美好的一天，

我正在尝试使用外部预编译文件创建一个把手演示。这是我的index.html：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Handlebars Demo</title>
</head>
<body>

<h2>Hello Handlebars!</h2>

<!--Your new content will be displayed in here-->
<div class="content-placeholder"></div>

<script src="components/jquery/dist/jquery.min.js"></script>
<script src="components/handlebars/handlebars.min.js"></script>
<script src="js/first.js"></script>
<script src="js/finished/first.tpl.js"></script>
</body>
</html>

这是我的javascript：

$(function () {
    // Grab the template script
    var theTemplateScript = $("#address-template").html();

    // Compile the template
    var theTemplate = Handlebars.compile(theTemplateScript);

    // Define our data object
    var context={
        "city": "London",
        "street": "Baker Street",
        "number": "221B"
    };

    // Pass our data to the template
    var theCompiledHtml = theTemplate(context);

    // Add the compiled html to the page
    $('.content-placeholder').html(theCompiledHtml);
});

这是我的第一个.hbs

<!--This is our template. -->
<!--Data will be inserted in its according place, replacing the brackets.-->
<script id="address-template" type="text/x-handlebars-template">
    <p>You can find me in {{city}}. My address is {{number}} {{street}}.</p>
</script>

我用这种方式编译了first.hbs：

把手模板/ first.jbs -f finished / first.tpl.js

和我的文件结构（我的javascript库驻留在组件中）：

+ HandlebarsDemo
    + components
    + js
        + finished
            + first.tpl.js
        + templates
            + first.jbs
      first.js
  index.html

我查看了以下内容：Handlebars Pass a string or Handlebars AST to Handlebars compile

我知道在将模板脚本加载到DOM之前需要使用Handlebars.compile（），因此我将我的javascript代码移到了底部，但仍然出现此错误。

有人有任何建议吗？

TIA，

COSON

Handlebars - 你必须将一个字符串或Handlebars AST传递给Handlebars.compile不能正常工作

0 个答案: