Question

我有一个问题，我希望将所有内容存储为带引号的字符串，并在表单中显示所有未引用的内容。我的第一个解决方案是创建两个额外的bindingHandler来执行此操作，一个用于值，一个用于文本。

ko.bindingHandlers.escapedValue = {
    init : function (element, valueAccessor, allBindingsAccessor) {
        var $element = $(element),
            contentObservable = valueAccessor(),
            currentTxt = ko.utils.unwrapObservable(contentObservable);

        if (currentTxt) {
            $element.val(unescape(currentTxt));
        }

        $element.change(function (e) {
            contentObservable(escape($element.val()));
        });
    }
};

ko.bindingHandlers.escapedText = {
    init : function (element, valueAccessor, allBindingsAccessor) {
        var $element = $(element),
            contentObservable = valueAccessor(),
            currentTxt = ko.utils.unwrapObservable(contentObservable);

        if (currentTxt) {
            $element.text(unescape(currentTxt));
        }

        contentObservable.subscribe(function (newValue) {
            $element.text(unescape(newValue));
        });
    }
};

然而，这给了我两个问题1）我在按键关闭后不再进行实时更新2）当我对值进行一些验证时，例如字符长度，它会检查引用字符串的长度。

我怎样才能写出类似ko.escapedObservable（）或ko.subscribable.fn.escaped（）

的内容

我已经接近但似乎无法保存正确。所以现在它正确显示并正确地进行比较，但是当我转到保存它时，值仍未被取消

ko.escapedObservable = function (initialValue) {
    var observableVal = ko.observable(initialValue),

    result = ko.computed({
        read: function () {
            return unescape(observableVal());
        },
        write: function (newValue) {
            return observableVal(escape(newValue));
        }
    });

    this.toJSON = function () {
        return escape(observableVal());
    };

    return result;
};

==== EDIT ==== 使用两个可观察量的解决方案 // Escape和Unescape文本值

ko.escapedObservable = function (initialValue) {
    var observableVal = ko.observable(initialValue),

    result = ko.computed({
        read: function () {
            return observableVal();
        },
        write: function (newValue) {
            observableVal(newValue);
        }
    });

    result.unescaped = ko.computed({
        read: function () {
            return unescape(observableVal());
        },
        write: function (newValue) {
            observableVal(escape(newValue));
        }
    });

    return result;
};

Answer 1

ko.escapedObservable = function (initialValue) {
    var observableVal = ko.observable(initialValue),

    result = ko.computed({
        read: function () {
            return observableVal();
        },
        write: function (newValue) {
            observableVal(newValue);
        }
    });

    result.unescaped = ko.computed({
        read: function () {
            return unescape(observableVal());
        },
        write: function (newValue) {
            observableVal(escape(newValue));
        }
    });

    return result;
};

Answer 2

我无法确切地知道你在问什么。但是，我相信你真的需要一个computed observable： [Example]

function viewModel() {
    this.test = ko.observable('\"Something\"');

    this.escapedTest = ko.computed(function () {
        return escape(this.test());
    }, this);

    this.unescapedTest = ko.computed(function () {
        return unescape(this.escapedTest());
    }, this);
}

在Knockout中编写一个转义/未转义的Observable

2 个答案: