2015-01-09 59 views
1

我最近开始使用Knockout玩,并且遇到了问题。我尝试过以各种方式使用谷歌搜索,但我找不到任何适用的结果。重新计算没有重置对象的计算Observable

比方说,我有这样的模式:

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计算观察到的结合,但每次Query观察到的变化和Parameters观察到的重新计算,我失去了所有的状态计算的项目。

我的意思是,如果我将绑定在HTML与Parameters一个foreach和我在这的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> 

的任何文本的用户在输入类型一旦重新计算了计算可观察值,将会丢失。

我该如何解决这个问题?

+0

是否有可能为你解释你的代码。参数数组完全改变了吗?如果它做了什么改变呢?文本改变的面是一个计算函数的整个点。如果你不想让它改变,那么不要让它成为一个计算。 –

+0

参数数组根据字符串“查询”而改变。这被分成一个包含'@@ par1'和'@@ par2'的字符串数组。只要更改字符串“query”中的文本,计算结果将被重新计算 –

+0

那么是什么导致它改变? –

回答

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

+0

这是否解决了您的问题?如果是这样,请选择我的答案作为解决方案。 –