Two way custom binding with knockut 3 and es5 plugin

Question

In my custom binding, I cannot write data back to model. The problem is that there is no way to write into "writable" property.

In knockout 2 there was possibility to use allBindingsAccessor()._ko_property_writers But in version 3 there are no such thing.

  ko.bindingHandlers.htmlValue = {
    init: function(element, valueAccessor, allBindingsAccessor, context) {
      var handler;
      handler = function() {
        var value, writable;
        writable = valueAccessor();
        console.log(allBindingsAccessor());
        value = element.innerHTML;
        // NOTE In previous versions this could be used:
        //writable(value);
        //writable = value <-- this also does not update model, as writable is simple string
        // Or this:
        //allBindingsAccessor()._ko_property_writers

        return allBindingsAccessor().htmlValue = value;
      };
      ko.utils.registerEventHandler(element, "keyup", handler);
      ko.utils.registerEventHandler(document, "click", handler);
    },
    update: function(element, valueAccessor) {
      var value;
      value = valueAccessor();
      if (element.innerHTML !== value) {
        element.innerHTML = value;
      }
    }
  };

var data = {
    name: 'blah'
};

ko.track(data);
ko.applyBindings({data: data});

My html:

<div contenteditable="true" data-bind="htmlValue: data.name"></div>
<input data-bind="value: data.name, valueUpdate: 'afterkeydown'"></input>
<input data-bind="value: data.name, valueUpdate: 'afterkeydown'"></input>

Js fiddle with this example: http://jsfiddle.net/t5rWd/2/

Expected behaviour: Inputs should update after changing div content (it's contenteditable)

Current behaviour: It works like one-way binding, div get's updated but cannot update inputs.

Seems like it is problem with ES plugin because following works: var obs = ko.getObservable(data, 'name'); obs(value); — Yevgeniy.Chernobrivets
Well I checked this answer, but in ko 3 there is no _ko_property_writers property. And writing ko.getObservable(data, 'name') for each binding is not feasible. — user133408
You are right, this is plugin problem, here is pull request to address this: github.com/SteveSanderson/knockout-es5/pull/15 — user133408

Unknown Unknown · Accepted Answer · 2015-05-10T10:17:40

Note that OP's comment will in fact probably serve as an answer. This is a bug with the knockout-es5-plugin.

Given that OP's account is now inactive I'm posting this community wiki answer to preserve that info. The full comment:

You are right, this is plugin problem, here is pull request to address this: github.com/SteveSanderson/knockout-es5/pull/15 – user133408 Jun 26 '14 at 12:42

Two way custom binding with knockut 3 and es5 plugin

1 Answers