如何控制空字符串的更新和序列化方式答案

【问题标题】：How to control how empty strings are updated and serialized如何控制空字符串的更新和序列化方式
【发布时间】：2014-01-31 02:18:50
【问题描述】：

这是一个 JSFiddle 来演示我的问题：http://jsfiddle.net/jeffreyrswenson/YMFec/7/

我有一个具有一个或多个可观察对象的视图模型。我创建了其中的大多数：

var x = ko.observable();

当我选择输入元素时，值从未定义更改为“”。因为我将 VM 序列化为某些“脏标志”逻辑的一部分，所以更改的值会导致一些问题。

我试过了：

var x = ko.observable("");

这会导致淘汰赛验证无法正常工作。

我可以使用 this.toJSON() 或 JSON 替换器来确保 JSON 按照我希望的方式进行序列化。（我更喜欢 this.toJSON()，但可以使用一个或两个）

那么有没有更好的方法来做到这一点？如果输入为空，是否有办法告诉 Knockout 将值保留为未定义？

【问题讨论】：

标签： knockout.js knockout-validation

【解决方案1】：

有没有办法告诉 Knockout 将值保留为未定义，如果输入为空？

您可以使用绑定处理程序来执行此操作。见updated fiddle

ko.bindingHandlers.undefinedVal = {
    init: function (element, valueAccessor, allBindings, viewModel, bindingContext) {
        var value = valueAccessor();
        if (ko.isObservable(value)) {
            if (value.length === 0) {
                $(element).text(typeof "undefined");
            } else {
                $(element).text(value);
            }
        }

    }
};

【讨论】：

感谢您的信息！不幸的是，这会导致验证停止工作。我认为这是个好主意。我现在正在努力解决...
@Jeff 看到这个updated fiddle - 它使用自定义验证规则。唯一的事情是，在您通过 lastName 输入字段进行选项卡后，lastName 可观察 get 的值被分配了 ""
@rwish45，您最后的更改修复了我评论过的问题。最终我没有使用你的答案，但这是很好的信息，帮助我找到了我最终使用的答案。

【解决方案2】：

我最终创建了一个自定义扩展器，它将空白字符串转换为未定义的。这允许验证和 JSON 按我的需要/期望工作。

这是一个演示自定义扩展器的 JSFiddle：http://jsfiddle.net/jeffreyrswenson/Gwse8/2/

ko.extenders.undefinedIfBlank = function (target, option) {
    if (option) {
        var convertBlank = function (newValue) {
            if (typeof newValue === "string" && newValue.length == 0) {
                return undefined;
            } else {
                return newValue;
            }
        };

        var result = ko.computed({
            read: target,
            write: function (newValue) {
                var current = target();
                if (newValue !== current) {
                    var convertedVal = convertBlank(newValue);
                    if (convertedVal === undefined) {
                        target.notifySubscribers(newValue);
                    }
                    target(convertedVal);
                }
            }
        }).extend({ notify: 'always' });

        var tempVal = convertBlank(target());
        target(tempVal);
        result(target());

        return result;
    }

    return target;
};

即使我没有使用@rwisch445 的答案，我也接受了这个答案。这是一个可行的答案，我认为对于某些人来说，这将是他们更愿意使用的答案。

【讨论】：