0

我正在开发一个数据审计 Web 应用程序，它有一个模型，其中包含几个由旧值、新值和当前值字段组成的字段集。当前值是一个计算字段（按 KO 术语），它使用相当简单的逻辑来决定是否应将旧值或新值用于当前值（基本上如果有新值则使用它，否则显示旧值）。整个表单中包含大约 20 个这样的字段集，我想避免kendo.bind单独调用所有这些字段集。

这是我希望能够做的一个例子（并且文档有点说应该有效，但没有）：

<div id="practiceSection">
    <div id="phoneNumber">
        <h4>Phone Number</h4>
        <span>Display Value:</span>
        <input id="displayPhoneNumber" data-bind="value: phoneNumber.DisplayValue"/><br/>
        <span>Old Value:</span>
        <input id="oldPhoneNumber" data-bind="value: phoneNumber.OldValue"/><br/>
        <span>New Value:</span>
        <input id="newPhoneNumber" data-bind="value: phoneNumber.NewValue"/><br/>
    </div>
</div>​

和javascript：

String.IsNullOrEmpty = function(value) {
    var isNullOrEmpty = true;
    if (value) {
        if (typeof (value) == 'string') {
            if (value.length > 0)
                isNullOrEmpty = false;
        }
    }
    return isNullOrEmpty;
}

function FieldBlock(oldValue, newValue) {
    this.OldValue = oldValue;
    this.NewValue = newValue;

    this.DisplayValue = function() {
        var newValue = this.get("NewValue");
        if (String.IsNullOrEmpty(newValue))
            return this.get("OldValue");

        return newValue;
    };
}

kendo.bind($("#practiceSection"), kendo.observable({
    phoneNumber: new FieldBlock("111-111-1111", null) 
}));

jsfiddle

上面的代码导致FieldBlock.DisplayValue始终返回未定义。奇怪的是，如果我将FieldBlock对象kendo.observable直接传递给（而不是作为匿名对象的属性值），则依赖方法确实有效。这是一个 jsfiddle ，它显示了有效的方法以及我试图避免的方法。

这是预期的行为，还是我错过了一些简单的东西？我正在使用 2012.01.322 版本。

如果我没有遗漏任何东西，我可以做些什么来在 Kendo UI 中进行这项工作（请注意，我不是 js 忍者，因此不太可能编辑他们的代码）？也许有更好的方法来实现这种行为？

希望通过将此问题重复发布到我信任的社区，我可能会得到更积极的回应

4

1 回答 1

1

我最终找到了一种解决方法（它有效，但我认为这不是真正的解决方案）。也许有更多 javascript 经验的人可以提供有关如何清理它的指示。jsfiddle

看来问题是我的依赖方法正在返回undefined，因为我this.get("oldValue")在应该使用this.get("phoneNumber.oldValue"). 这似乎是一个范围界定问题。为了处理要传递给的 fieldName 部分，get我将其作为函数对象的参数，如下所示：

function FieldBlock(oldValue, newValue, fieldName) {
    this.OldValue = oldValue;
    this.NewValue = newValue;

    this.DisplayValue = function() {
        var newValue = this.get(fieldName + ".NewValue");
        if (String.IsNullOrEmpty(newValue))
            return this.get(fieldName + ".OldValue");

        return newValue;
    };
}

kendo.bind($("#practiceSection"), kendo.observable({
    phoneNumber: new FieldBlock("111-111-1111", null, "phoneNumber"),
    faxNumber: new FieldBlock("999-999-9999", null, "faxNumber")    
}));

就像我说的，这看起来很脏，但确实有效。我还不太确定在需要时如何处理另一层嵌套，但至少我知道问题出在哪里。

收到来自 Telerik 的 Atanas 的确认，这实际上是一个错误：

您好，感谢您的澄清。我确认这是一个错误。当存在嵌套视图模型时，“this”上下文是错误的。在您的示例中，“this”应该是“phone”对象，但它是“viewModel”。

我找到了一个修复程序，它将成为下一个正式版本的一部分。在此之前，您可以使用您找到的解决方法。

感谢您报告此问题。

问候， Telerik 团队的 Atanas Korchev

希望当其他人开始采用他们的 MVVM 解决方案时，它会得到修复。

于 2012-04-04T14:46:20.793 回答