再利用値

Question

私は私がtextの計算値を再利用したい、それを計算しないであろうtextとcss特性

<!-- ko foreach: items --> 
<span data-bind="text: $root.calculateText($data), css: { someClass: $root.calculateText($data) == 'someText'} "></span> 
<!-- /ko --> 

ためdata-bindを使用していた（foreachループ内）spanを有しますCSSの2回目。

ノックアウトの能力はありますか？

私が考えていたオプションは、メソッドの中にありますcalculateTextプロパティに追加calculateTextこれをCSSで再利用します。しかし、より効率的なソリューションを見つけることを願っています。

Answer 1

ルートのcalculateTextメソッドを使用する計算済みオブザーバブルを作成できます。ルートを使用するには、子オブジェクトの親として渡します。

私はこの実証JsFiddle作成しました：たとえば http://jsfiddle.net/YannickArien/BuH7N/398/

を。

var Item = function(name, parent) { 
    var _self = this; 

    _self.name = ko.observable(name); 
    _self.parent = parent; 
    _self.yourComputed = ko.computed(function() { 
     return _self.parent.calculateText(_self);   
    }, this); 
}; 

var ViewModel = function() { 
    var _self = this; 

    _self.calculateText = function(item) { 
     return item.name(); // Or whatever you want to do here. 
    } 

    _self.items = ko.observableArray([ 
     new Item("one", _self), 
     new Item("two", _self), 
     new Item("three", _self) 
     ]); 
}; 

ko.applyBindings(new ViewModel()); 

あなたが計算された部分を無視して、次のような何かを行うことができ、完全を期すため

が、それは、正確な要件に依存します。次の2行は、以前のバージョンと比較して唯一の変更点です。

_self.yourComputed = _self.parent.calculateText(_self); 

<span data-bind="text: yourComputed, css: { someClass: yourComputed == 'two'} "></span>