What is the best way of cloning/copying an observablearray in knockoutJS?

Question says it all really. I want to copy an observable array to another in KnockoutJS.


Solution 1:

To clone an observableArray you would want to do:

var viewModel = {
    array1: ko.observableArray(["one", "two"]),
    array2: ko.observableArray()
};

viewModel.clone = function() {
   viewModel.array1(viewModel.array2.slice(0));
};

If you want to just do a copy, then you would do:

viewModel.array1(viewModel.array2());

The problem with the second example is that the underlying array is the same, so pushing to array1 or array2 would result in both having the new value (as they both point to the same array).

Solution 2:

I was faced with the same task; to clone an observable array. The only way I could figure out how to do it, is to convert the observable to an JS object, then convert that object to an observable object. The following function requires KnockoutJS mapping plugin: http://knockoutjs.com/documentation/plugins-mapping.html

function cloneObservable(observableObject) {
    return ko.mapping.fromJS(ko.toJS(observableObject));
}

Hope this helps

Solution 3:

Assuming you have something like:

modelA { someValues: observableArray(); }
modelB { iWantYourValues: observableArray(); }

You should be able to:

modelB.iWantYourValues(modelA.someValues())