敲除文本绑定到 json 对象答案

【问题标题】：Knockout text bind to a json object敲除文本绑定到 json 对象
【发布时间】：2014-10-27 21:54:26
【问题描述】：

我有一个 ViewModel，里面有一个 observable。每次我点击一个按钮时，我都会用 ajax 填充这个 observable：

$.ajax({
    url: '/Contracts/Details/' + id,
    dataType: 'json',
    type: 'GET',
    success: function (data) {
        self.showContractDetail(true);
        self.contractDetail(data.contract);
        alert(self.contractDetail().Partner.Surname);
    }
});

警报显示正确的值。但在我的 html 中，我有：

<h2>contract number <span data-bind="text: contractDetail.ContractNumber"></span></h2>    
<h4>partner: <span data-bind="text: contractDetail.Partner.Surname"></span></h4>

但是什么也没显示。如果我将text: contractDetail. 替换为text: contractDetail().，则只显示第一个绑定。即：它显示contract number: 236578 和partner: <empty>。如果我评论data-bind="text: contractDetail().ContractNumber"，那么姓氏就会出现。

对为什么会发生这种情况有任何帮助吗？我不想将contractDetail 绑定到我的viewModel。我希望我的 viewModel 包含一个带有复杂合同细节的 observable。

【问题讨论】：

标签： knockout.js

【解决方案1】：

你能制作一个显示问题的 JSFiddle 吗？我现在正在回答这个问题，因为我要说的太多了，无法发表评论，但是如果我无法重现该问题，我无法真正验证它是否可以解决任何问题。

text: contractDetail. 应该更改为 text: contractDetail(). 是正确的。执行此操作时，控制台中是否显示任何错误？

另一种方法是将这两行 html 包装在一个虚拟绑定中：

<!-- ko with: contractDetail -->
<h2>contract number <span data-bind="text: ContractNumber"></span></h2>    
<h4>partner: <span data-bind="text: Partner.Surname"></span></h4>
<!-- /ko -->

【讨论】：