Knockout.js模板不起作用 [英] knockoutjs template not working
本文介绍了Knockout.js模板不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在观看有关淘汰赛的视频,我不知道为什么我的代码无法正常工作.
I was following a video about knockout and I have no idea why my code is not working.
我正在使用以下js脚本:
I'm using these js scripts:
<script src="assets/js/knockout-2.0.0.js" type="text/javascript"></script>
<script src="assets/js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="assets/js/jquery.tmpl.min.js" type="text/javascript"></script>
<h2>Friends</h2>
<ul data-bind="template: {name: 'friendsTemplate', foreach:friends}"></ul>
<script type="text/html" id="friendsTemplate">
<li>${ data.name }</li>
</script>
<script type="text/javascript">
function friend(name) {
return { name : ko.observable(name) };
}
var viewModel = {
friends : ko.observableArray([new friend('João'), new friend('Lucas')])
};
ko.applyBindings(viewModel);
</script>
此代码向我返回了此信息,它显示的是正确数量的朋友,但未显示姓名.
This code returns me this, it is showing the correct amount of friends but not displaying the names.
Friends
${ data.name }
${ data.name }
我在做什么错了?
谢谢.
编辑 进行一些测试,此代码有效,因为它未使用模板,因此我的代码是正确的,问题仅出在模板上.
EDIT Making some tests and this code works because it is not using template, so my code is correct, the problem is only with template.
<script type="text/html" id="friendsTemplate">
<li><span data-bind="text: name"></span></li>
</script>
推荐答案
在剔除js之前,您应该先引用jquery.tmpl
you should reference jquery.tmpl prior to knockoutjs
<script src="assets/js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="assets/js/jquery.tmpl.min.js" type="text/javascript"></script>
<script src="assets/js/knockout-2.0.0.js" type="text/javascript"></script>
并将$ {data.name}更改为$ {name}
and change ${ data.name } to ${name}
这篇关于Knockout.js模板不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文