Knockout inheritance plus mapping

Question

Edit: Turns out my problem was an ID10T error. I had copied one of the concrete class definitions but forgot to change the name. JavaScript happily let me redefine the entity without any Knockout related methods. D'Oh!

This question builds on the answer to another Knockout/inheritance question. Using the answer from that question, I was able to build a basic hierarchy. However, I want to use the mapping plugin like I usually do with object data. However, when I try to use mapping, my knockout child class doesn't behave like it should.

Here's a cut down bit of the code:

tubs.Gen2Event = function (data) {
    var self = this;
    //...Set a bunch of props...
    return self;
}

tubs.Gen2LandedEvent = function (data) {
    var self = this;
    ko.utils.extend(self, new tubs.Gen2Event(data));
    // If I exclude the following mapping call, the object is fine
    ko.mapping.fromJS(data, {}, self);
    //...Other methods that worked fine before mapping...
}

I'm familiar with custom mapping, but from what I can find, it seems like it's meant for fine tuning child properties, not modifying the entire object.

Anders Anders · Accepted Answer · 2013-04-26T07:20:38

I would use real prototype inheritance if I where you, for example

http://ejohn.org/blog/simple-javascript-inheritance/

http://jsfiddle.net/4Kp3Q/

Person = Class.extend({
  init: function(data){
      this.firstname = ko.observable();
      this.lastname = ko.observable();      
      ko.mapping.fromJS(data, {}, this);
  }
});

Employee = Person.extend({
  init: function(data){
      this.salary = ko.observable();     
      this._super(data);
  }
});

var data = { firstname: "foo", lastname: "bar", salary: 200000 };
ko.applyBindings(new Employee(data));

Knockout inheritance plus mapping

1 Answers