knockoutJS 中的匿名模板
我有一段代码在 knockout.js 中工作,如下所示:
<div>
... some other markup here
<div class="topicDetail" data-bind='template: { name: "topicTemplate", data: activeTopic}'> </div>
</div>
<script type="text/html" id="topicTemplate">
<ul class="querylist" data-bind='template: {name: "queryTemplate", foreach: queries}'></ul>
</script>
<script type="text/html" id ="queryTemplate">
<li class="query" data-bind="css: { active: selected()}, queryType: type">
<span class="querylink" data-bind="click: select">{{= text}}</span>
<span data-bind="withdocs: positiveExamples"></span>
<span data-bind='person: searcher'> </span>
<span data-bind='time: time'></span>
</li>
</script>
withdocs
、person
和 time
是我的自定义绑定。我想我应该使用匿名模板更简洁地重写它,如下所示:
<div class="topicDetail" data-bind="with: activeTopic">
<ul class="querylist" data-bind="foreach: queries">
<li class="query">
<span class="querylink" data-bind="click: select">{{= text}}</span>
<span data-bind="withdocs: positiveExamples"></span>
<span data-bind='person: searcher'> </span>
<span data-bind='time: time'></span>
</li>
</ul>
</div>
但这失败并出现错误:
Uncaught Error: Unable to parse binding attribute.
Message: ReferenceError: queries is not defined;
Attribute value: foreach: queries
在 Knockout-1.2.1.debug.js 的第 1226 行中。这是指 UL
数据绑定。
我创建了一个 jsfiddle 来抽象这个问题,但是小提琴有效。我还应该注意什么来追踪这个问题?
I have a piece of code working in knockout.js like this:
<div>
... some other markup here
<div class="topicDetail" data-bind='template: { name: "topicTemplate", data: activeTopic}'> </div>
</div>
<script type="text/html" id="topicTemplate">
<ul class="querylist" data-bind='template: {name: "queryTemplate", foreach: queries}'></ul>
</script>
<script type="text/html" id ="queryTemplate">
<li class="query" data-bind="css: { active: selected()}, queryType: type">
<span class="querylink" data-bind="click: select">{{= text}}</span>
<span data-bind="withdocs: positiveExamples"></span>
<span data-bind='person: searcher'> </span>
<span data-bind='time: time'></span>
</li>
</script>
withdocs
, person
, and time
are my custom bindings. I thought I should rewrite it more succinctly using anonymous templates like this:
<div class="topicDetail" data-bind="with: activeTopic">
<ul class="querylist" data-bind="foreach: queries">
<li class="query">
<span class="querylink" data-bind="click: select">{{= text}}</span>
<span data-bind="withdocs: positiveExamples"></span>
<span data-bind='person: searcher'> </span>
<span data-bind='time: time'></span>
</li>
</ul>
</div>
But this fails with the error:
Uncaught Error: Unable to parse binding attribute.
Message: ReferenceError: queries is not defined;
Attribute value: foreach: queries
in line 1226 of knockout-1.2.1.debug.js. This refers to the UL
data binding.
I created a jsfiddle that abstracted this problem, but the fiddle works. What else should I be looking at to track this down?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
如果您按照您的说明使用淘汰赛 1.2.1:
……那就是你的问题了。您需要使用1.3.0版本。请参阅 中的“控制流绑定”部分http://blog.stevensanderson.com/2011/08/31/knockout-1-3-0-beta-available/ 了解更多详情。
你的小提琴工作的原因是它使用了最新版本的淘汰赛。
If you are using knockout 1.2.1 as you stated:
... then that is your problem. You need to use version 1.3.0. See the section on "Control flow bindings" in http://blog.stevensanderson.com/2011/08/31/knockout-1-3-0-beta-available/ for more details.
The reason your fiddle worked is that it using the latest version of knockout.