我有一个简单的Handlebars示例,我无法让它工作!请帮忙。我想让谷歌应用引擎留言簿与把手而不是jinja2
一起使用HTML /模板代码如下:
Hello {{user.nickname}}
<h2>Top 10 Most Recent Guestbook Entries</h2>
{{#each greetings}}
<br>
<small>[<i>{{date.ctime}}</i>]</small>
<b>
{{#if author}}
<code>{{author.nickname}}</code>
{{else}}
<i>anonymous</i>
{{/if}}
</b>
wrote:
{{comment}}
{{/each}}
</script>
<div id="comment_content"> </div>
<form id="comments" action="">
<div><textarea id="comment" name="content" rows="3" cols="60"></textarea></div>
<div><input id="comment_button" type="button" value="submit"></div>
</form>
<a href="{{ url }}">{{ url_linktext }}</a>
这是JS代码:
<script>
$(document).ready(function() {
var source = $("#entry-template");
var srcHTML =source.html();
var template = Handlebars.compile(srcHTML);
// put all your jQuery goodness in here.
$("#comment_button").click(function(event) {
var data = JSON.stringify({
"login": "/_ah/login?continue=http%3A//localhost%3A8080/show",
"logout": "/_ah/login?continue=http%3A//localhost%3A8080/show&action=Logout",
"user": {
"nickname": "dummy",
"email": "dummy@me.com"
},
"greetings": [
{
"comment": "COMMENT1",
"date": {
"ctime": "Sun Feb 10 23:20:21 2013"
},
"author": {
"nickname": "dummy",
"email": "dummy@me.com"
}
}
]
})
var html = template(data);
console.log(html);
$("#comment_content").html(html);
});
});
</script>
以下是我引用Handlebar源代码的方法
Can someone please help?
非常感谢你
答案 0 :(得分:0)
您最大的问题是您正在使用JSON.stringify
为已编译的模板函数准备数据:
var data = JSON.stringify({ ... });
var html = template(data);
当它只需要对象时,最终会将template
函数传递给字符串(这是所需数据的JSON表示)。删除JSON.stringify
,事情会开始变得更好:
var data = { ... };
var html = template(data);
演示:http://jsfiddle.net/ambiguous/Axmbd/
此外,这部分HTML:
<a href="{{ url }}">{{ url_linktext }}</a>
似乎不在模板的<script>
内,因此{{url}}
和{{url_linktext}}
不会被填写。您可以通过将<a>
移到正确的位置。