为什么我的 $parent 绑定上下文在 Knockout.js foreach 模板中是空的？答案

【问题标题】：Why is my $parent binding context empty inside a Knockout.js foreach template?为什么我的 $parent 绑定上下文在 Knockout.js foreach 模板中是空的？
【发布时间】：2015-02-17 09:10:09
【问题描述】：

我正在通过 Knockout 调用以下模板：

<script type="text/html" id="uploaded-files-template">
    <li data-bind="text: original_name"></li>
    <pre data-bind="text: ko.toJSON($parent, null, 2)"></pre>
</script>

这是在 foreach 循环中被调用的：

<ul class="files-list" data-bind="template: { name: 'uploaded-files-template', foreach: uploadedFiles, as: 'uploadedFile' }"></ul>

我正在尝试从我的模板访问$parent 绑定上下文，但我被告知它是undefined，当我尝试将其输出为 JSON 格式时（正如我在上面所做的那样），它是空的。

$uploadedFiles 是ko.observableArray()：

self.uploadedFiles = ko.observableArray([]);

通过 AJAX 填充，如下所示：

然后继续：

$.each(message.objects, function(index, object) {
    self.uploadedFiles.push(object);
});

如果我用$data 替换$parent，我可以看到正在输出的当前迭代。知道为什么这个$parent 没有显示任何内容吗？

【问题讨论】：

标签： javascript html data-binding knockout.js

【解决方案1】：

您的模板和绑定没有问题，请参阅工作fiddle。

var SimpleListModel = function(items) {
    this.uploadedFiles = ko.observableArray(items);    
};

var model = new SimpleListModel([
    { original_name: "One" }, 
    { original_name: "Two" },
    { original_name: "Three" }]
)

ko.applyBindings(model);

这一定是您的 viewModel 或 viewModel 群体中的错误。

【讨论】：

*完美！你是对的，vm中一定有问题。
我没有看到我的虚拟机有任何差异，除了你将items 参数传递给你的虚拟机，而我不能这样做。我已经在我的 VM 中声明了我的 uploadedFiles 可观察数组，并将其填充到我的 VM 中。
类似jsfiddle.net/supercool/ysnuky9n/1 的东西也应该可以工作。
@supercool，我完全不知道为什么这对你有用，但对我没有用。为了填充数组，我正在推动对象，但这不应该有什么不同，当然......
嗯，我找到了答案。在下面检查我的。感谢大家的帮助。

【解决方案2】：

呃……嗯，这很尴尬。我的 $parent 上下文是空的，因为我没有实例化我的 ViewModel。我正在这样做：

$(document).ready(function() {
    ko.applyBindings(uploadViewModel);
});

什么时候我应该这样做：

$(document).ready(function() {
    ko.applyBindings(new uploadViewModel());
});

感谢 Max Brodin 和 supercool 的帮助。

【讨论】：