初始化可从元素属性值观察到的Knockout

Initialize Knockout observable from element attribute value

本文关键字：观察 Knockout 属性 元素 初始化      更新时间：2023-10-15

我有一个元素，它拥有一个属性，其值绑定到一个可观察到的敲除：

<text transform='matrix(1 0 0 1 1 1)' data-bind='attr:{transform:textTransform}'></text>

当元素加载时，我希望observable包含在dom元素上定义的值，但是它加载为未定义的，并且属性一起从dom元素中删除：

<text data-bind='attr:{transform:textTransform}'></text>

是否可以初始化从dom元素属性中可观察到的敲除的值，并保持dom元素属性的值？

更新：http://jsfiddle.net/5Z2SC/10/

另一个选项是使用自定义绑定，并在init函数中收集元素的当前值。在我看来，这更容易重复使用。

ko.bindingHandlers.transform = {
    init: function(element, valueAccessor) {
        valueAccessor()(element.getAttribute('transform'));
    },
    update: function(element, valueAccessor) {
        var value = valueAccessor();
        element.setAttribute('transform', ko.utils.unwrapObservable(value))
    }
};

当然，你的会更复杂，因为你必须用这个transform属性做的事情。这种逻辑可能会出现在update部分。

只有调用ko.applyBindings（）才能解析数据绑定属性。因此，如果需要从元素中获取属性数据，可以这样做。

function MyModel(){
    this.textTransform = ko.observable($('#myElement').attr('transform'));
}
ko.applyBindings(new MyModel());

基本上，您获取属性的值，并将其设置为可观察对象的初始值。数据绑定属性是一个模板，因此应该在ViewModel中指定初始值或默认值。

另一种选择是编写一个自定义绑定器，如果observable返回null，它可以存储默认值。。。

相关文章：