如何替换knockoutjs中的给定索引元素

Question

如何用另一个元素替换observableArray中的给定索引.

我有: ViewModel.Elements()[index]

我怎么能用另一个元素替换它.

Answer 1

observableArrays有一个replace方法.这将接收旧项目和新项目.

所以,你会称之为:

ViewModel.Elements.replace(ViewModel.Elements()[index], yourNewElement);

在内部,这只是将索引设置为新项目并调用valueHasMutated()以通知任何潜在订阅者.

Answer 2

现在已经有点晚了,但我注意到这个问题仍未得到解答(正确).

正如其他人所说,第一个答案没有给出预期的行为,它将取代一个observableArrayby value而不是by的项目index!

其他答案过于复杂,并没有利用Knockout的扩展本地人.

要真正替换给定index的值observableArray,您应该使用该splice()方法.

var myObservable = ko.observableArray([1, 2, 3, 4]);
myObservable.splice(0, 1, 100); // Replace the value at [0] with "100"
myObservable.splice(2, 1, 300); // Replace the value at [2] with "300"
console.log(myObservable()); // [100, 2, 300, 4]

并且由于该splice()方法由Knockout扩展,它将自动通知任何依赖项,从而无需调用valueHasMutated().

编辑/ 2016年2月14日

如果您需要一次替换多个值,那么获取底层数组,执行替换然后通知更改会更快.

var myObservable = ko.observableArray([1, 2, 3, 4]);
var underlyingArray = myObservable();

myObservable.valueWillMutate();

for(...)
   underlyingArray[i] = newValue[i];

this.valueHasMutated();

Answer 3

就像dvijaz正确指出的那样,接受的答案取代了给定的值.当给定值在数组中不唯一时,这可能会导致问题.

而不是切片阵列,然后将阵列粘合在一起,我做了以下更可读的恕我直言:

ViewModel.Elements()[index] = yourNewElement;
ViewModel.Elements.valueHasMutated();

感谢RP Niemeyer指出.replace内部工作原理.

您还可以扩展observableArray以支持此:

ko.observableArray.fn.replaceIndex = function(index, newValue) {
    this.valueWillMutate();
    this()[index] = newValue;
    this.valueHasMutated();
};

这意味着您可以执行以下操作:

var arr = ko.observableArray([1, 2, 1, 4]);
arr.replaceIndex(2, 3); 
console.log(arr()); // logs [1, 2, 3, 4]