把手不起作用

时间:2018-04-12 07:03:54

标签: javascript jquery handlebars.js

请帮我学习把手。我是第一次尝试,我不知道为什么这段代码不起作用。代码的第一部分在我的html中。

<body>
    <div id="container">
            <script id="contact-template" type="text/x-handlebars-template"></script>
                <div class="entry">
                        <h1>I'm {{title}}</h1>
                        <div class="body">
                          {{body}}
                        </div>
                      </div>
            </script>


  (async function (){ 
      let source = $('#contact-template')
      let template = Handlebars.compile(source);

      let context = {
        title: "My New Post",
        body: "This is my first post!"
      };
      let html = template(context);
      $('#container').append(html);
 }())

enter image description here

1 个答案:

答案 0 :(得分:0)

首先在handlebars.js

下载把手套件

试试这个..希望这可以帮助你,不要忘记将包添加到你的项目中并调用包

<head>
   <script type="text/javascript" src="js/handlebars-v4.0.11.js"></script>
</head>
<body>
    <div id="container">

    </div>
      <script type="text/javascript">
        let entry = '<div id="contact-template">' +
                    '<div class="entry">' +
                      '<h1>I`m {{title}}</h1>' +
                      '<div class="body">{{body}}</div>' +
                    '</div>' +
                  '</div>'
        let source = entry;
        let template = Handlebars.compile(source);

        let context = {
          title: "My New Post",
          body: "This is my first post!"
        };
        let html = template(context);
        $('#container').append(html);
      </script>
</body>

注意:请勿使用<script type="text/x-handlebars-template">,因为在加载页面时脚本未运行,但请使用<script type="text/javascript">