【问题标题】:Knockout.js: access parent collection in data-bind eventKnockout.js:在数据绑定事件中访问父集合
【发布时间】:2012-12-13 05:28:12
【问题描述】:

假设我有一个

<button type="button" data-bind="click: actions.remove">×</button>

和一个处理程序

var actions = {
    remove: function(item) {
        ?array?.remove(item); // ?array? is a containing array, accessed somehow
    }
}

如何找到?array?,以便在任何foreach 绑定中使用相同的button

澄清:
如果我将remove 放入视图模型,我知道该怎么做。然而,视图模型包含分层数组,我真的不想为了在正确的位置获取方法而经历所有这些。在ko.mapping 的帮助下,视图模型也会偶尔从服务器更新,但这不会向新数据添加任何方法。这就是我单独实现处理程序的原因。

【问题讨论】:

    标签: javascript knockout.js


    【解决方案1】:

    你试试这样的。

    <div data-bind="foreach: someArray">
        <button type="button" data-bind="click: $parent.actions.remove">x</button>
    </div>
    
    
    //Inside your viewmodel.
    var self = this;
    self.someArray = ko.observableArray();
    self.actions = {
    remove: function() {
        self.someArray.remove(this); // ?array? is a containing array, accessed somehow
    }
    }
    

    编辑:对不起,我误解了你的意思。您可以尝试这样的方法,使其适用于任何 foreach 绑定。

    <div data-bind="foreach: someArray">
        <button type="button" data-bind="click: function() {$parent.actions.remove($parent.someArray(), $data}">x</button>
    </div>
    
    
    //Inside your viewmodel.
    var self = this;
    self.someArray = ko.observableArray();
    self.actions = {
    remove: function(arr, item) {
        arr.remove(item); // ?array? is a containing array, accessed somehow
    }
    }
    

    【讨论】:

    • 谢谢,我知道我可以做到,但是数组是分层的,所有这些都会很快掌握,这就是我分离处理程序的原因。更新了问题。
    • 如果您不想在每个视图模型中删除方法,那么您可以将其存储在根视图模型中并使用 $root 而不是 $parents。或者你甚至可以插入一个匿名函数绑定到点击绑定。试试这样,点击:function() {$parent.someArray().remove($data).
    【解决方案2】:

    目前不可能。

    我为此提出了一个新的淘汰赛问题(目前开放):
    Allow access to the current array through the binding context

    也相关:Support for $last in foreach

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-07-01
    • 2011-09-08
    • 1970-01-01
    • 2013-01-13
    • 2014-09-09
    • 1970-01-01
    • 2021-08-03
    • 2018-09-23
    相关资源
    最近更新 更多