- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我是 Handlebars 和 Javascript 的新手,所以我提前道歉。作为学习 Handlebars 的一种方法,我尝试将在线示例中的所有基本组件放入一个独立的网页中。然而它运行得并不好。
<html>
<head>
<script type="text/javascript" src="scripts/jquery-3.1.1.min.js" />
<script type="text/javascript" src="scripts/handlebars-v4.0.5.js" />
</head>
<body>
<div id="content-placeholder"></div>
<script id="some-template" type="text/x-handlebars-template">
<table>
<thead>
<th>Username</th>
<th>Real Name</th>
<th>Email</th>
</thead>
<tbody>
{{#users}}
<tr>
<td>{{username}}</td>
<td>{{firstName}} {{lastName}}</td>
<td>{{email}}</td>
</tr>
{{/users}}
</tbody>
</table>
</script>
<script>
var source = $("#some-template").html();
alert(source);
var template = Handlebars.compile(source);
var data = { users: [
{username: "alan", firstName: "Alan", lastName: "Johnson", email: "alan@test.com" },
{username: "allison", firstName: "Allison", lastName: "House", email: "allison@test.com" },
{username: "ryan", firstName: "Ryan", lastName: "Carson", email: "ryan@test.com" }
]};
$("#content-placeholder").html(template(data));
</script>
</body>
</html>
此外,我无法打印源代码(alert(source) 显示“未定义”)。有什么遗漏吗?感谢您的帮助!
最佳答案
看起来您还没有关闭顶部的 script
ta,其中包含 jQuery
和 Handlebars
。
您应该关闭脚本标签:
<script type="text/javascript" src="scripts/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="scripts/handlebars-v4.0.5.js"></script>
这是完整的工作代码
var source = $("#some-template").html();
alert(source);
var template = Handlebars.compile(source);
var data = {
users: [{
username: "alan",
firstName: "Alan",
lastName: "Johnson",
email: "alan@test.com"
}, {
username: "allison",
firstName: "Allison",
lastName: "House",
email: "allison@test.com"
}, {
username: "ryan",
firstName: "Ryan",
lastName: "Carson",
email: "ryan@test.com"
}]
};
$("#content-placeholder").html(template(data));
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.6/handlebars.min.js"></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<div id="content-placeholder"></div>
<script id="some-template" type="text/x-handlebars-template">
<table>
<thead>
<th>Username</th>
<th>Real Name</th>
<th>Email</th>
</thead>
<tbody>
{{#users}}
<tr>
<td>{{username}}</td>
<td>{{firstName}} {{lastName}}</td>
<td>{{email}}</td>
</tr>
{{/users}}
</tbody>
</table>
</script>
关于javascript - Handlebars : not able to compile?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41622936/
我已经启动并运行了 6 个节点的 cloudera 5.0 beta 集群 但是我无法使用命令查看hadoop HDFS的文件和文件夹 sudo -u hdfs hadoop fs -ls / 在输出
我使用 Hibernate 4.1.7 和 EhCache 作为二级缓存。我正在实现一项休息服务,以根据需要清除 cahce(驱逐所有区域)。 下面是代码片段 org.hibernate.stat.S
所以有列表?,seq?,向量?, map ?等等以确定参数是什么类型的集合。 什么是区分两者的好方法 map (即包含键值对的东西) 一个集合(即包含值的东西) 一个非集合值,如字符串。 有没有比这更
我是 Handlebars 和 Javascript 的新手,所以我提前道歉。作为学习 Handlebars 的一种方法,我尝试将在线示例中的所有基本组件放入一个独立的网页中。然而它运行得并不好。
我如何从显示语句中转义大括号 progress abl ?? 我们的 friend 谷歌没有找到任何信息 DISPLAY "{"httCust":[]}" 最佳答案 使用波浪号 ~ 转义大括号和双引号
我编写此代码是为了打印一个可能的骑士之旅,以便每个地方都被访问一次。 public class Main{ static int move[][]=new int[8][8];
所以这是我的程序的第二个问题,但是是一个完全不同的问题,感谢那位乐于助人的人建议 JSON 作为一种更好的方法来完成我想要的事情...... 无论如何... JSON 取得了一些成功。该程序也改变了主
我正在尝试与我拥有的一些数据创建一对多关系。 我有一个Project和许多项目,我正在尝试设置 Controller 来保存它们,但这是我第一次使用一对多关系,我的头是关于爆炸。 这就是我的保存方法
我试图在 Apache Tomcat/MySQL/Win 10 环境中设置 Broadleaf eCommerce,但我无法部署 WAR。我已经通过 Broadleaf 博客/论坛和 StackExc
我一直在尝试使用 python ebaysdk,但我无法理解为什么我不断收到以下错误: {'Timestamp': '2017-02-21T19:55:31.915Z', 'Errors': {'Lo
我知道这是一个非常广泛的问题,但我对此很好奇,所以我决定问一下。请理解,不幸的是,我提供的信息是我所拥有的全部:) 我想知道,在C++程序中,下面的情况可能发生在哪些情况下: 以下是(模仿的)代码片段
type Friend struct { name string age int } type Friends struct { friends []Friend } 我想让
select() 是一个很棒的系统调用。您可以打包任意数量的文件描述符、套接字描述符、管道等,并在输入可用时以同步方式收到通知。 有没有办法创建一个间隔/一次性计时器并将其与 select() 一起使
我在解码 HEVC 时遇到问题使用 avcodec 编码的视频。 修改源代码的一行允许解码mpeg1这不是我需要的。 谢谢 #include #include #include #include
我们正在构建一个 AbleCommerce 7 网上商店,并尝试将其与现有的销售点系统集成。产品库存将在实体店和网上商店之间共享,因此我们需要定期更新每种产品的手头数量,以使 POS 和网上商店尽可能
我刚刚下载了 openfire 3.10。 安装正常。但是当我启动 Openfire 服务器时,它在启动过程中出现以下错误: java.lang.IllegalArgumentException: I
对于以下脚本 #!/bin/sh count1=0 noOfArg=0 checkOtherParam() { echo $parameter retu
我尝试根据 README 文件调用命令,使用 maven 编译 TMT 工具包源代码 mvn compile 但是由于项目根目录下没有pom.xml文件,所以maven无法编译项目。 我还尝试使用空的
我有一个关于查询的问题,我实际上是在尝试膨胀 View ,其中可以将添加为 friend 的人添加到 recyclerView 中。 @Override public void onStart(){
我的 reducer 输入值是一个 double 组。 719.000 501.000 -75.000 501.000 508.000 -62.000 -75.000 -62.000 10.000
我是一名优秀的程序员,十分优秀!