在Knockout.js中轉換observable的屬性

我有一個使用template綁定綁定的記錄的observableArray。這工作正常。由於我想跟蹤每條記錄的變化，因此observableArray由observable組成。這也適用。在Knockout.js中轉換observable的屬性

我現在想要的是將每個記錄（即每個observable）的一些屬性轉換爲不同的類型。

我該如何繼續？

通常，我可以使用一個computed，但在這種情況下，我不能將一個單獨的computed可觀察數組添加到數組中，因爲我需要它們中的多個。

那麼我該如何解決這個問題呢？

來源

2012-09-25 Golo Roden

這是一個使用包裝observableArray的每個項目的視圖模型的解決方案。然後這個視圖模型可以包含一個計算的屬性。

var ItemViewModel = function (value) { 
    this.value = ko.observable(value); 
    this.computedValue = ko.computed(function() { 
     return this.value() * 2;   
    }, this);  
}; 

var ViewModel = function (list) { 
    var self = this; 
    self.list = ko.observableArray([]);     
    ko.utils.arrayForEach(list, function (value) { 
     self.list.push(new ItemViewModel(value)); 
    }); 
}; 

ko.applyBindings(new ViewModel([1,2,3])); 


<ul data-bind="foreach: list"> 
<li data-bind="text: computedValue"></li> 
</ul>

來源

2012-09-25 08:28:04 gbs

您可以添加一個函數到您的視圖模型，該模型需要一個參數，該參數是可觀察數組中的項目。該綁定將運行dependentObservable中的函數，因此任何具有訪問值的可觀察項都將創建一個依賴項。

因此，舉例來說，從Ryan Niemeyer's jsFiddle，你可以有以下標記：

type "one", "two", or "three": <input data-bind="value: text" /> 
<hr /> 
<ul data-bind="template: { name: 'itemTmpl', foreach: items }"></ul> 

<script id="itemTmpl" type="text/html"> 
    <li data-bind="text: name, visible: viewModel.shouldThisBeVisible(name)"></li> 
</script>

。與視圖模型：

var viewModel = { 
    text: ko.observable("one"), 
    items: [{name: "one"}, {name: "two"}, {name: "three"}], 
}; 

viewModel.shouldThisBeVisible = function(name) { 
    return this.text() === name; 
}.bind(viewModel); 

ko.applyBindings(viewModel);

關鍵位是函數帶有參數'name'。在你的情況下，這將是你可觀察數組中的一個項目。

希望這會有所幫助。

來源

2012-09-25 08:03:49

在Knockout.js中轉換observable的屬性

回答

相關問題