Handlebars 4.0.2 应包含哪些源文件?
What source files should be included for Handlebars 4.0.2?
我才刚刚开始使用 Handlebars.js,我已经对 HTML 中应该包含的内容感到困惑。
我设置了一个最小的 helloworl HTML 文件,如下所示:
<html>
<body>
<script id="entry-template" type="text/x-handlebars-template">
<div class="entry">
<h1>{{title}}</h1>
<div class="body">
{{body}}
</div>
</div>
</script>
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/handlebars/handlebars.js"></script>
<script src="bower_components/handlebars/handlebars.runtime.js"></script>
<script type="text/javascript">
var source = $("#entry-template").html();
var template = Handlebars.compile(source);
var context = {title: "My New Post", body: "This is my first post!"};
var html = template(context);
document.write(html);
</script>
</body>
</html>
我收到以下错误:
[Error] TypeError: undefined is not a function (evaluating 'Handlebars.compile(source)')
global code (index.html, line 17)
要使这个最小示例正常工作,还应包括哪些其他依赖项?
使用的版本:
- jQuery2.1.4
- 车把 4.0.2
您对 bower_components/handlebars/handlebars.runtime.js
的调用将覆盖 bower_components/handlebars/handlebars.js
设置的内容。
使用 handlebars.runtime.js
意味着您的模板已经编译,因此您获得的 Handlebars
对象不包含 compile
函数。
删除 <script src="bower_components/handlebars/handlebars.runtime.js"></script>
你应该可以开始了:http://jsfiddle.net/nikoshr/dr3gwh7u/
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/handlebars/handlebars.js"></script>
<script type="text/javascript">
var source = $("#entry-template").html();
var template = Handlebars.compile(source);
var context = {title: "My New Post", body: "This is my first post!"};
var html = template(context);
$('body').append(html)
</script>
我才刚刚开始使用 Handlebars.js,我已经对 HTML 中应该包含的内容感到困惑。
我设置了一个最小的 helloworl HTML 文件,如下所示:
<html>
<body>
<script id="entry-template" type="text/x-handlebars-template">
<div class="entry">
<h1>{{title}}</h1>
<div class="body">
{{body}}
</div>
</div>
</script>
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/handlebars/handlebars.js"></script>
<script src="bower_components/handlebars/handlebars.runtime.js"></script>
<script type="text/javascript">
var source = $("#entry-template").html();
var template = Handlebars.compile(source);
var context = {title: "My New Post", body: "This is my first post!"};
var html = template(context);
document.write(html);
</script>
</body>
</html>
我收到以下错误:
[Error] TypeError: undefined is not a function (evaluating 'Handlebars.compile(source)')
global code (index.html, line 17)
要使这个最小示例正常工作,还应包括哪些其他依赖项?
使用的版本:
- jQuery2.1.4
- 车把 4.0.2
您对
bower_components/handlebars/handlebars.runtime.js
的调用将覆盖bower_components/handlebars/handlebars.js
设置的内容。使用
handlebars.runtime.js
意味着您的模板已经编译,因此您获得的Handlebars
对象不包含compile
函数。
删除 <script src="bower_components/handlebars/handlebars.runtime.js"></script>
你应该可以开始了:http://jsfiddle.net/nikoshr/dr3gwh7u/
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/handlebars/handlebars.js"></script>
<script type="text/javascript">
var source = $("#entry-template").html();
var template = Handlebars.compile(source);
var context = {title: "My New Post", body: "This is my first post!"};
var html = template(context);
$('body').append(html)
</script>