[英]Swap 2 items in observableArray - knockout
正在嘗試用剔除替換observableArray中的2個項目之間的內容,但是出了點問題。
替換項目后,我將進行更改並將displayOrder屬性(在兩個itmems中)發送到服務器(或者我應該采用其他方法)
ReplaceBetweenTwoitemsInArray: function () {
console.log("ranking down msg");
var currentItemindex = viewModel.myobservableArray.indexOf(this);
var nextItemIndex = currentItemindex + 1;
viewModel.myobservableArray .replace(
viewModel.myobservableArray ()[nextItemIndex],
viewModel.myobservableArray ()[currentItemindex]
);
}
只有第一項更改為第二項,但第二項沒有成為第一項
與Paoli的答案類似,但也會觸發可觀察值的更新,可能是DRYer。
http://jsfiddle.net/marrok/ckMJE/101/
<ul data-bind="foreach: colors">
<li><span data-bind="text:color"></span>
</li>
</ul>
<br/>
<span>From:</span><input type="text" data-bind="value:from"/>
<br/>
<span>TO:</span><input type="text" data-bind="value:to"/>
<br/>
<button data-bind="click:swap">Swap It</button>
使用Javascript:
var ViewModel = function() {
this.self = this;
self.from = ko.observable(0); // default
self.to = ko.observable(1); // default
self.colors = ko.observableArray([{
color: 'red'},
{
color: 'green'},
{
color: 'pink'},
{
color: 'blue'},
{
color: 'yellow'}]);
self.swap= function() {
var iTo = parseInt(self.to());
var iFrom = parseInt(self.from());
var from = self.colors()[iFrom];
var to = self.colors()[iTo];
console.log("Before", self.colors().map(function(d){return d.color;} ), from, to, iFrom, iTo)
self.colors()[iTo] = from;
self.colors()[iFrom] = to;
console.log("After ", self.colors().map(function(d){return d.color;} ), from, to, iFrom, iTo)
self.colors.valueHasMutated()
};
};
model = new ViewModel()
ko.applyBindings(model);
您可以使用一個臨時變量:
var arr = ko.observableArray([0, 1])
// Should produce arr() = [0, 1]
var tmp = arr()[0];
arr()[0] = arr()[1];
arr()[1] = tmp;
// At this point, arr() is [1, 0]
您可以像這樣直接在observableArray上直接使用remove和splice函數:
var arr=ko.observableArray(["x","y"]);
var index=arr.indexOf("y");
var tmp=arr()[index-1];
arr.remove(tmp);
arr.splice(index,0,tmp);
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.