Question

我最近开始玩Knockout而且我遇到了问题。我曾尝试用各种方式搜索谷歌，但我找不到任何适用的结果。

让我们说我有这个模型：

var model = new function () {
    var that = this;

    this.parameterRegex = ko.observable(/\@@{1}\w+/ig);
    this.query = ko.observable('SELECT @@par1 from @@par2');
    this.parameterNames = ko.computed(function () {
        var allParameters = that.query().match(that.parameterRegex());
        return (allParameters == undefined) ? [] : jQuery.unique(allParameters);
    });
    this.parameters = ko.computed(function () {
        return ko.utils.arrayMap(that.parameterNames(), function (item) {
            return {
                Name: ko.observable(item),
                Example: ko.observable()
            }

        });
    });
};

在HTML中我与Parameters计算的observable绑定，但每次Query可观察的更改和Parameters可观察的重新计算时，我都会丢失所有项目的状态计算。

我的意思是，如果我将HTML中的foreach绑定到Parameters，并且我在该foreach中有一些输入框，例如：

<textarea name="query" class="form-control" data-bind="value: query, valueUpdate:'afterkeydown'" rows="10" style="margin-bottom:20px"></textarea>
<div data-bind="foreach: parameters">
    <p data-bind="text: Name"></p>
    <input type="text"></input>
</div>

重新计算Computed Observeable后，用户在输入中键入的任何文本都将丢失。

我将如何解决这个问题？

Answer 1

解决方案是保持一个单独的数组与其中的对象，然后重新使用数组中存在的对象，而不是每次重新创建它们。

var parameters = [];
this.parameters = ko.computed(function () {
    var newParams = [];
    for (var i = 0; i < that.parameterNames().length; i++) {
        var name = that.parameterNames()[i];
        var result = $.grep(parameters, function(p){ return p.Name() == name; });
        var param;
        if (result.length === 0) {
            param = {
                Name: ko.observable(name),
                Example: ko.observable()
            };
        }
        else {
            param = result[0];
        }

        newParams.push(param);
    }
    parameters = newParams;
    return newParams;
});

jsfiddle

重新计算Computed Observable而不重置对象

1 个答案: