Knockout.js：时间输入格式和值限制

当我使用knockout在视图模型中绑定数字数据时，它会正确显示，但如果用户更改输入标记值，则会将数据类型更改为string。提交字符串的问题是，服务器需要一个没有隐式转换的数值

有没有办法告诉knockout保持原始属性值的数据类型？

我的示例代码将视图模型名称与输入标记名称相匹配。我使用不引人注目的敲除来进行绑定，效果很好

// Bind the first object returned to the first view model object
// FNS is the namespace, VM is the view model
FNS.VM.Items[0] = ko.mapping.fromJS(data.Items[0]);

// For each property found, find the matching input and bind it
$.each(FNS.VM.Items[0], function (indexInArray, valueOfElement) {
    var attrName = indexInArray;
    var attrValue;
    if (typeof valueOfElement == "function")
        attrValue = valueOfElement();
    else
        attrValue = valueOfElement;

    var a = $('input[name="' + attrName + '"][type="checkbox"]');
    if (a.length)
        a.dataBind({ checked: 'VM.Items[0].' + attrName });

    var b = $('input[name="' + attrName + '"][type="radio"]');
    if (b.length)
        b.dataBind({ checked: 'VM.Items[0].' + attrName });

    var c = $('input[name="' + attrName + '"][type="text"]');
    if (c.length)
        c.dataBind({ value: 'VM.Items[0].' + attrName });
});
ko.applyBindings(FNS);

---

下面是一个线程，它使用了一些不同的技术来保持数值：

一种选择是将此关注点推到视图模型中，并创建一个

numericObservable

来代替普通的可观察对象。它可能看起来像：

ko.numericObservable = function(initialValue) {
    var _actual = ko.observable(initialValue);

    var result = ko.dependentObservable({
        read: function() {
            return _actual();
        },
        write: function(newValue) {
            var parsedValue = parseFloat(newValue);
            _actual(isNaN(parsedValue) ? newValue : parsedValue);
        }
    });

    return result;
};

ko.bindingHandlers.numericValue = {
    init : function(element, valueAccessor, allBindings, data, context) {
        var interceptor = ko.computed({
            read: function() {
                return ko.unwrap(valueAccessor());
            },
            write: function(value) {
                if (!isNaN(value)) {
                    valueAccessor()(parseFloat(value));
                }                
            },
            disposeWhenNodeIsRemoved: element 
        });

        ko.applyBindingsToNode(element, { value: interceptor }, context);
    }
};

样本：

另一个选项是使用自定义绑定处理此问题。您可以定义一个

numericValue

绑定并使用它，而不是使用

value

绑定。它可能看起来像：

ko.numericObservable = function(initialValue) {
    var _actual = ko.observable(initialValue);

    var result = ko.dependentObservable({
        read: function() {
            return _actual();
        },
        write: function(newValue) {
            var parsedValue = parseFloat(newValue);
            _actual(isNaN(parsedValue) ? newValue : parsedValue);
        }
    });

    return result;
};

ko.bindingHandlers.numericValue = {
    init : function(element, valueAccessor, allBindings, data, context) {
        var interceptor = ko.computed({
            read: function() {
                return ko.unwrap(valueAccessor());
            },
            write: function(value) {
                if (!isNaN(value)) {
                    valueAccessor()(parseFloat(value));
                }                
            },
            disposeWhenNodeIsRemoved: element 
        });

        ko.applyBindingsToNode(element, { value: interceptor }, context);
    }
};

---

示例：

您的回答让我找到了Unwriteable DependentToServables，它共同回答了我的问题。ThanksQuick note：阅读淘汰提交我看到RP Niemeyer在这里引用了他自己的答案，并简要说明：有一种更受支持的方式来调用ko.bindingHandlers.value.init行……任何阅读本文的人，请注意DependentToServable（）现在被称为computed（）。注意：@IanYates绑定注释的进一步内容。ko 3.2.0 kbh值中断任何更新的使用。忽略ko.bindingHandlers.value.update调用。如果需要更改从模型读取的值，请使用interceptor.read函数。e、 g.强制使用字符串返回underlyingObservable（）.toString（）@RockResolve-更新了与当前KO更兼容的方法。