文本绑定适用于淘汰赛,但不适用于模板

发布于 2024-12-05 18:27:55 字数 1370 浏览 1 评论 0原文

我刚刚开始使用 knockout.js,但遇到了障碍。我可以绑定文本变量,但似乎无法对模板执行任何操作。这里出了什么问题?

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
    <script src="underscore-min.js" type="text/javascript"></script>
    <script src="knockout-1.2.1.js" type="text/javascript"></script>

<script id="myTemplate" type="text/x-jquery-tmpl">
{{each objs}}
    ${var1} ${var2}<br/>
{{/each}}
</script>

<script type="text/javascript">
var myObj = function(var1, var2) {
    this.var1 = var1;
    this.var2 = var2;
}

var viewModel = {
    myText: ko.observable("See...?"),
    objs: ko.observableArray([
        new myObj("Foo","Bar"),
        new myObj("Foo","Bar")
    ])
};
</script>

<script type="text/javascript">
$(document).ready(function(){
    ko.applyBindings(viewModel);
});
</script>


</head>
<body>
<div id="main">
    This works:
    <span data-bind="text: myText"></span>
    <br/>

    There should be stuff here:
    <span data-bind="template: 'myTemplate'"></span>
    But there isn't.
</div>
</body>
</html>

顺便说一句,我得到这个输出:

This works: See...?
There should be stuff here: But there isn't. 

I'm just getting started with knockout.js, and I've hit a snag. I can bind text variables, but can't seem to do anything with templates. What's going wrong here?

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
    <script src="underscore-min.js" type="text/javascript"></script>
    <script src="knockout-1.2.1.js" type="text/javascript"></script>

<script id="myTemplate" type="text/x-jquery-tmpl">
{{each objs}}
    ${var1} ${var2}<br/>
{{/each}}
</script>

<script type="text/javascript">
var myObj = function(var1, var2) {
    this.var1 = var1;
    this.var2 = var2;
}

var viewModel = {
    myText: ko.observable("See...?"),
    objs: ko.observableArray([
        new myObj("Foo","Bar"),
        new myObj("Foo","Bar")
    ])
};
</script>

<script type="text/javascript">
$(document).ready(function(){
    ko.applyBindings(viewModel);
});
</script>


</head>
<body>
<div id="main">
    This works:
    <span data-bind="text: myText"></span>
    <br/>

    There should be stuff here:
    <span data-bind="template: 'myTemplate'"></span>
    But there isn't.
</div>
</body>
</html>

BTW, I get this output:

This works: See...?
There should be stuff here: But there isn't. 

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

一笑百媚生 2024-12-12 18:27:55

啊哈。我缺少 jquery.tmpl.min.js。

关于淘汰文档的一件事是,它确实大量包含内联示例,但很难找到实际设置文件的示例。

Aha. I was missing jquery.tmpl.min.js.

One thing about the knockout documentation--it's really heavy on the inline examples, but it's hard to find an example that actually sets up the files.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文