KnockoutJS exender doesnt work with mapping plugin

Question

I found some odd behavior with observable extenders in combination with knockout mapping. I've used the sample extender for rounding numbers from the documentation.

In order to get it running with knockout mapping I extend the observable by overwriting the 'create' field. In comparison I've created another observable directly in the view model.

When binding those two to an input field they behave pretty much the same (e.g. when you in 'a' it will be corrected to 0) except for this special case: When the old value is 0 and you type in 'a' again it will not be corrected on the mapped observable.

function Model() {
        this.myNumberOne = 0;    
}

function AppViewModel(model) {
        ko.mapping.fromJS(model, {
            'myNumberOne': {
                create: function(options) {
                return ko.observable(options.data).extend({numeric: 2});
            }
        }
    }, this);
    this.myNumberTwo = ko.observable(0).extend({numeric: 2});
}

var vm = new AppViewModel(new Model());

You can test it here: http://jsfiddle.net/3S9xG/

Can anyone tell me why they don't behave the same and how to fix it?

Thanks in advance

Fischerman

Answer 1

ko.mapping got issue with knockout v3.x ko.computed.

You can try old knockout v2.x, or use a patched ko.mapping https://raw.githubusercontent.com/andrewaylett/knockout.mapping/ko3/knockout.mapping.js

updated your jsfiddle with the ko.mapping patch. http://jsfiddle.net/3S9xG/2/

Also, there is a typo in your existing code

return result;a // anyway, the extra 'a' doesn't break javascript.