在applyBindings上获取“$ item未定义”

时间:2011-07-12 11:55:04

标签: javascript jquery knockout.js jquery-templates

我正在尝试使用knockout来执行一个非常基本的绑定,但是无法从jquery.tmpl访问$item变量。当我应用绑定时,我不断得到“$item未定义”。

我之前已经这样做了所以我知道可以做到但我无法弄清楚为什么它在这种情况下不起作用。有趣的是,如果我删除templateOptions:{parentItem: $item},那么一切都按预期工作。

我已包含以下文件

<script type="text/javascript" src="Extension/resources/jquery.1.6.1.js"></script>
<script type="text/javascript" src="Extension/resources/jquery.tmpl.js"></script>
<script type="text/javascript" src="Extension/resources/knockout-1.2.1.js"></script>

我的模板和绑定看起来像这样

<script type="text/html" id="itemTemplate">
    <span data-bind="text:title"></span>
</script>

<div class="filterResults">
        <span  data-bind="text:message"></span>
        # of items: <span data-bind="text:contentItems().length"></span>
        <table cellspacing="0">
            <tr data-bind="template: { name: 'itemTemplate', foreach: contentItems, 
            templateOptions:{parentItem: $item} 
            }"> </tr>
        </table>            
</div>

我使用以下方式进行绑定:

//viewModel contains a contentItems observableArray
ko.applyBindings(viewModel, $('.filterResults')[0]);

1 个答案:

答案 0 :(得分:1)

好的,看起来我自己可以回答这个问题。问题似乎是我执行数据绑定并尝试访问jquery.tmpl变量$ item的部分实际上并没有使用jquery.tmpl

<tr data-bind="template: { name: 'itemTemplate', foreach: contentItems, 
        templateOptions:{parentItem: $item} 
        }"> </tr>

这不在模板中,因此没有$ item变量可供访问。 $ item与jquery.tmpl相关联,而不是knockoutjs。解决这个问题的方法是将视图模型放在那里。

<tr data-bind="template: { name: 'itemTemplate', foreach: contentItems, 
        templateOptions:{parentItem: viewModel} 
        }"> </tr>

在实际的模板中,(本例中为itemTemplate),我可以访问$ item变量。