Using ko.mapping to populate my observableArray into existing methods

Question

I have a viewModel which has this observableArray

(function () {
    function myItems() {
        var self = this;
        self.itemArray = ko.observableArray();
        somefunction() {...
}
var myViewModel = new myItems();

This observableArray will contain instances of this:

(function () {
    function item() {
        var self = this;
        self.name = ko.observable("some data");
        self.doStuff = function () {
            return "doing whatever";
        };
    }
    window.item = item
}());

I map my json into the viewModel

var json = '{"name":"my main property", "itemArray": [ { "name": "Bob" }, { "name" : "Fred" } ] }';

var myViewModel = new myItems();
ko.mapping.fromJSON(state, {}, myViewModel);

How do I tell the mapping that it must map itemArray using the item object? How do I create the link between item() and myItems()?

Here's a fiddle showing the issue http://jsfiddle.net/dexster/hLEMz/7/

dex · Accepted Answer · 2013-04-18 07:29:39Z

1

Solution is to use the create callback of the mapping options

var mapping = {
    'itemArray': {
        create: function (options) {
            //add items to the items object here
            ...

answered Apr 18, 2013 at 7:29

dex

2851 gold badge4 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Paul Manzotti · Accepted Answer · 2013-04-17 19:14:58Z

0

Well, once you've serialised it into JSON to store the state, you're back to the position you were in before you processed the JSON data to populate your view models in the first place.

Actually, that's the first issue you have, you are serialising the new viewmodel, if you serialise itemArray on the viewmodel, then you will have the data that you started with:

var unmapped = ko.mapping.toJSON(myViewModel1.itemArray);

Then, you can just pass that in to your addItems method:

myViewModel2.addItems(unmapped);

instead of mapping them.

Here's an updated jsFiddle

edited Apr 17, 2013 at 19:14

answered Apr 17, 2013 at 19:01

Paul Manzotti

5,14523 silver badges28 bronze badges

3 Comments

dex Over a year ago

Thanks for this but my fiddle doesn't reflect my real code which also has many properties in the main viewmodel. I need to use mapping to populate these properties again. If I could solve this issue I could probably remove addItems() and use mapping for the initial population loading of my viewmodel data

dex Over a year ago

I've edited the question and fiddle to better explain the issue

Paul Manzotti Over a year ago

In that case, you need to use the create function map, as answered by Dex.

Collectives™ on Stack Overflow

Using ko.mapping to populate my observableArray into existing methods

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related