无法从上下文访问Knockout嵌套视图模型方法的问题咨询

这个问题的核心是Knockout绑定上下文的层级理解，我们一步步来拆解和解决：

问题原因分析 #

你的ViewModel结构是：ModelA → modelBList（ModelB实例）→ listItems（可观察数组）。当你在foreach: modelBList.listItems中时，绑定上下文的层级是：

• 根上下文：ModelA实例
• 第一层子上下文：listItems中的单个元素（比如'one'、'two'）

这时候$parent指向的是根上下文ModelA，而不是你期望的ModelB实例，所以$parent.clickMe自然找不到对应的方法，点击也就没反应了。

解决方案 #

这里提供几种靠谱的解决方式，你可以根据场景选择：

方案1：通过根上下文直接引用ModelB的方法

既然modelBList是ModelA的属性，你可以直接通过$root（始终指向根ViewModel）来访问ModelB的方法：

<ul data-bind="foreach: modelBList.listItems">
  <li data-bind="text: $data, click: $root.modelBList.clickMe"></li>
</ul>

这种方式简单直接，适合层级不复杂的场景。

方案2：用with绑定切换上下文（更优雅）

如果想让$parent在foreach中指向ModelB，可以先通过with绑定把上下文切换到modelBList，再进行foreach循环：

<div data-bind="with: modelBList">
  <ul data-bind="foreach: listItems">
    <li data-bind="text: $data, click: $parent.clickMe"></li>
  </ul>
</div>

此时with绑定已经把上下文切换到ModelB实例，foreach内部的$parent就会指向ModelB，完美匹配你的预期。

额外建议：优化ViewModel命名 #

你的ModelA里的modelBList命名有点误导，它其实是单个ModelB实例而非数组，建议改成modelB会更清晰，避免后续混淆：

ModelA = function () {
  var self = this;
  self.modelB = new ModelB(); // 更准确的命名
};

对应的视图也改成foreach: modelB.listItems，代码可读性会更好。

内容的提问来源于stack exchange，提问作者Dom