Подтвердить что ты не робот

Нокаут js → Привязать к редактируемому тексту div?

Как связать видимый с редактируемым текстовым содержимым div?

4b9b3361

Ответ 1

Вам нужно будет изменить привязку "текст" по умолчанию, чтобы он мог записать содержимое отредактированного div обратно в наблюдаемое. Простой пользовательский обработчик привязки для этой задачи может выглядеть следующим образом:

ko.bindingHandlers.editableText = {
    init: function(element, valueAccessor) {
        $(element).on('blur', function() {
            var observable = valueAccessor();
            observable( $(this).text() );
        });
    },
    update: function(element, valueAccessor) {
        var value = ko.utils.unwrapObservable(valueAccessor());
        $(element).text(value);
    }
};

Но обратите внимание, что для этого примера кода требуется jQuery.

Использование так же просто:

<div contentEditable="true" data-bind="editableText: foo"></div>

Вот пример (написанный на CoffeeScript): http://jsfiddle.net/aBUEu/1/

Ответ 2

Вы не можете сделать это по умолчанию, потому что изменение текста в редактируемом div не приведет к возникновению какого-либо события, которое обновило бы значение в вашей модели.

Для этого вам понадобится специальная привязка. Вы можете прочитать об этом здесь: http://knockoutjs.com/documentation/custom-bindings.html