Question

有时，JS库会修改HTML元素或创建新元素。在我的例子中，JQuery Texteditor是一个简洁的WYSIWYG编辑器，需要一个textarea元素才能启动（通过在元素上调用.jqte（））。编辑器将改变现有的html，textarea实际上将消失，文本将包含在div中。

因此，textarea上的值绑定将不会与模型同步。为了使编辑器工作，我需要在文本编辑器完成修改后创建一个绑定元素。

使用所需的html预设启动编辑器的方法是一种解决方案，但编辑器不提供这样的初始化。

我相信敲除只会绑定到.applyBindings（）初始绑定的元素。或者以某种方式绑定到新创建的元素？例如，我可以为输入元素创建一个值绑定，然后将其“重定向”到文本编辑器的字段吗？

Answer 1

有一些API可能对您有所帮助：

ko.applyBindingAccessorsToNode和ko.applyBindingsToNode可以直接向元素添加绑定。

ko.applyBindingAccessorsToNode并接受了访问函数，这些函数返回要绑定的值以确保绑定之间的依赖关系被隔离。

您可以这样称呼：

ko.applyBindingAccessorsToNode(element, { 
    text: function() { 
         return context.$data.first() + ' ' + context.$data.last();
    }
}, context);

ko.applyBindingsToNode会为您包含访问器函数中的值，但您希望确保不访问所传递的对象中的依赖项（在构建绑定时不要访问可观察的值）您传递的内容如text: first() + ' ' + last()

典型的通话如下：

ko.applyBindingsToNode(element, { text: myValue, visible: showValue }, context);

另一个有用的电话是ko.applyBindingsToDescendants。你称之为：

ko.applyBindingsToDescendants(viewModelOrContext, element);

这将强制使用常规绑定机制绑定元素的子元素。如果您确实遇到标记稍后出现并且对它们进行data-bind绑定的情况，那么您可以在新元素的父级上调用它。你真的只想调用一次，除非子元素被你正在处理的任何库动态交换。

Answer 2

您可以创建一个绑定处理程序，将元素添加到绑定元素，如

http://jsfiddle.net/G68Ct/

ko.bindingHandlers.myBinding = {
    init: function(element) {
        var myElement = document.createElement("span");
        myElement.innerText = "My element";
        element.appendChild(myElement);
    }
};

可以在.applyBindings（）之后创建元素并绑定到VM吗？

2 个答案: