Question

我正在开发一个数据审计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始终返回undefined。奇怪的是，如果我将FieldBlock对象直接传递给kendo.observable（而不是匿名对象的属性值），则依赖方法会起作用。 Here is a jsfiddle显示了什么可行，但也显示了我想要避免的内容。

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

如果我没有遗漏某些东西，我可以做些什么来使这个工作在Kendo UI（注意我不是一个js忍者，所以编辑他们的代码不是一个可能的选择）？也许有更好的方法来实现这种行为？

_{希望通过double posting这个问题发送给我信任的社区，我可能会得到更积极的回应}

Answer 1

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

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

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的

Received confirmation实际上它是一个错误：

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

我获得了一个修复程序，它将成为下一个正式版本的一部分。直到   然后你可以使用你找到的解决方法。

感谢您报告此问题。

此致   Atanas Korchev   Telerik团队

希望在其他人开始采用他们的MVVM解决方案时，它会被解决。

嵌套的ViewModel依赖方法不起作用

1 个答案: