1

最近 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されるたびに、計算されたアイテムのすべての状態が失われます。QueryParameters

これが意味することは、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 Observable が再計算されると失われます。

これを解決するにはどうすればよいですか?

4

1 に答える 1

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

于 2015-01-09T13:55:32.143 に答える