Question

我的click bind没有调用fullName函数什么是正确的方式来调用它？

<div>
    <div data-bind="with: test.name" >
        <div>
        <span data-bind="text:firstName"></span>
        <span data-bind="text:firstName"></span>
        <br />
        <div>
        <span data-bind="click: $parent.fullName">FullName</span>
    </div>
</div>

modal = function(){
    var firstName = ko.observable('jhon'),
        lastName = ko.observable('deo'),
        test = {
            name : {
              firstName: firstName,
              lastName: lastName
           },
            fullName : function(){
                alert(name.firstName() + name.lastName());
            }
        };

    return {
        test: test
    }
}();

ko.applyBindings(modal);

Answer 1

$ parent元属性引用绑定层次结构中紧邻上方的绑定，而不是视图模型中的父对象。由于您的with位于主绑定上下文中，因此$ parent引用了根视图模型。

如果您需要访问菜单，您可以将其嵌套在另一个绑定中：

<div data-bind="with: test">
  <div data-bind="with: name">
  [...]
    <button data-bind="click: $parent.fullName">Click</button>
  </div>
</div>

或从父绑定开始对您的调用进行限定（模态或示例中的根绑定）：

<button data-bind="click: $parent.test.fullName">Click</button>

关于绑定上下文与模型层次结构的一些澄清：

使用 with：test.name 绑定时，使用原始绑定

，绑定上下文将像：

<body> <!-- binding context: [modal] -->
  <div data-bind="with: test.name"> <!-- binding context: [modal|test.name] -->

相反，当应用上面显示的嵌套绑定时，层次结构将更改为：

<body> <!-- bc: [modal] -->
  <div data-bind="with: test"> <!-- bc: [modal|test] -->
    <div data-bind="with: name"> <!-- bc: [modal|test|name] -->

Answer 2

您的点击事件应如下所示：

<span data-bind="click: $parent.test.fullName">FullName</span>

我已更新了您fiddle

如何在绑定中获取父对象

2 个答案: