Question

是否完全有可能获得数据(模型)实例必须具备的相应要素(或要素)?

例如,我在ViewModel 属性中拥有一系列个人物品仓库。

我将视图模式绑在它所形成的视图上,例如:

<div class="people" data-bind="template: { foreach: people }">
    <a href="#" class="person" data-bind="text: name"></a>
</div>

然后通过jQuery 将一些事件处理器捆绑起来:

$container.on( click ,  .person , function(e){
    e.preventDefault();
    self.showPerson( ko.dataFor(this) );
});

在我的 < code> showPerson 方法中,我将保留对模型的引用。我/ 可以/ 也可以/ 也保留对元素的引用, 但如果我不需要, 我不想这样做。

self.showPerson = function(person) {
    // can i get the corresponding element from the  person  model?
};

有谁有想法吗?

Answer 1

您的语法和使用 $container 的 jquery 和 person 的第二个参数对我来说并不熟悉, 但在您的点击处理器中, 您的点击处理器中不是被点击的元素吗? 您能否将此也传递到您的 showPperson 方法?

$container.on( click ,  .person , function(e){
    e.preventDefault();
    self.showPerson( ko.dataFor(this), this );
});

self.showPerson = function(person, element) {
    // can i get the corresponding element from the  person  model?
};

我不知道有什么办法可以从我的头顶上得到一个可观测到的元素,但可能有几个不同的元素。你可以有一个名称的文本框,在一个横线上显示名称,在计算时使用,有订户,在另一个绑定的计算中使用名称(.)的长度。

也就是说,如果您使用击倒的调试版本,您可以看到您的可见效果有一个属性,该属性可能具有您要查找的属性。缩写版本是一个单字符。

Answer 2

您可以简单地创建一个自定义约束

    // data-bind="element: observable"
    // sets observable to element ..
    ko.bindingHandlers.element = {
        init: function(element, valueAccessor) {
            var target = valueAccessor();
            target(element);
        }
    };

在您的视图模型中,创建一个字段以存储元素:

person.el = ko.observable(null);

然后在你的 html 模板...

<div data-bind="element: el"> .... </div>

Answer 3

为什么不移动在您的 foreach 中绑定的单击事件?

在此情况下, 您的 showPerson () 函数将拥有 person 的正确数据

编辑:

对不起,但我猜我错过了你问题的核心:

self.showPerson = function (person, event) {
     element = event.srcElement
     ...
}

Answer 4

self.showPerson = function(data, event) {
  // event.currentTarget is the DOM element
  // $(event.currentTarget) gives the jQuery element
}

Answer 5

我认为,最佳做法是直接与视觉模型上的功能相关,而不是附加操作员。

< a href=" "https://stackoverflow.com/ questions/13804705/knockout-js-knockout-js-click- contact- to-parent- opident- in- foreach" > 点击对父函数的连接

友情链接