2

我有一个项目，我无法弄清楚如何从容器模板调用的单击事件中访问 observableArray。我在这里的小提琴中有一个精简的例子：

http://jsfiddle.net/zBarW/26/

点击事件在模板中指定，然后从项目本身的属性动态加载每个项目的模板。

所以一个示例项目是：

{ID: 1, TemplateName: 'template1', Label: 'Name', Description: 'Your name'}

“父”模板如下所示：

<script type="text/html" id="tpl-placeholder">
<div class="entry" data-bind="click: $parent.RemoveEntry, attr: { id: ID}, template: {name: TemplateName }"></div>
</script>

动态加载的模板如下所示：

<script type="text/html" id="template1">
    <h1 data-bind="text: Label"></h1>
    <div data-bind="text: Description"></div>
</script>

在处理单击事件的方法中 - 在本例中为 RemoveEntry - 在尝试访问 observableArray (Entries) 时我得到 null。

这是视图模型：

var viewModel = {

    Name: ko.observable("Entries"),

    Entries: ko.observableArray( entries ),

    RemoveEntry: function (entry) {
        // how do I access the "Entries" list here - this.Entries returns null
        $("#debug").text(this.Entries == null);
        this.Entries.remove(entry);
    }
};

我是一个淘汰赛新手..有人可以告诉我我在这里做错了什么吗？谢谢！

4

2 回答 2

2

你拥有它的方式，你直接访问 viewmodel.Entries...

但是，更典型的是，您会这样做：-

http://jsfiddle.net/keith_nicholas/RAMcc/

用好的 ol javascript hack

var self = this;
于 2012-06-26T22:19:01.370 回答
0

在我最初的测试中，我发现我可以使用viewModel.Entries。我觉得基思的反应比较好，肯定是比较典型的方法。为了完整起见，我将把它留在这里。

对于我的示例，这有效：

RemoveEntry: function (entry) {
    // how do I access the "Entries" list here - this.Entries returns null
    $("#debug").text(viewModel.Entries == null);
    viewModel.Entries.remove(entry);
}
于 2012-06-26T22:19:19.233 回答