Adding Observable to an ObserableArray Item

Question

I am currently having an issue extending my ObserableArray objects so they have extra observables attributes.

What I am trying to do is something like this:

ko.utils.arrayForEach(MyKnockoutManager.GetByModelKeyName('Catalog'), 
            function (CatalogItem) 
            {
                CatalogItem.IsSelected = ko.observable(false);
            });

However, that of course is not the case.

Is there any way to add observables to obserableArray's objects?

PW Kad · Accepted Answer · 2013-10-24 02:17:22Z

1

To add an additional property all you need to do is set it -

CatalogItem.IsSelected = ko.obsrevable(false);

That will add an additional property onto the object just like you want. If you are trying to add it onto every object then why not add it when the object is constructed?

function catalogItemModel(item) {
    var self = this;
    self.Id = ko.observable(id);
    self.Name = ko.observable(name);
    self.someOtherPropertyLikeIsSelected = ko.observable(false);
}

var thisArray = ko.observableArray();
var thisData = [{ id: 1, name: 'Jim' }, { id: 2, name: 'Bob' }];

$.each(thisData, function (index, item) {
    new catalogItemModel(item);
});

Using a model ensures consistency between all of your observables passed in. You can also use use prototypes to add the functions after the data has been mapped but I don't think that is what you are looking for.

Edit

I see what you are saying about iterating through the items to add the property but it's not really the right direction you want to take. If you must do so just adjust your code to the following -

var vm.CatalogItems = ko.observable(MyKnockoutManager.Items.slice());
ko.utils.arrayForEach(vm.CatalogItems(), function (CatalogItem) {
    CatalogItem.IsSelected = ko.observable(false);
});

edited Oct 24, 2013 at 2:17

answered Oct 24, 2013 at 2:03

PW Kad

15k7 gold badges51 silver badges83 bronze badges

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

2 Comments

Exitium Over a year ago

I was having difficulty adding a new property because I was using the knockout mapping plug-in. I tried using the mapping options but was unable to get the mapping value to stick. Otherwise, the construction of the model beforehand would have been the optimal choice.

PW Kad Over a year ago

I don't quite understand - just override the mapping and add the property, or do exactly what you are trying to in your question and iterate through the options and add a property.

Collectives™ on Stack Overflow

Adding Observable to an ObserableArray Item

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related