Knockout.js 将敲除属性绑定到svg文本元素的长度

我想将knockout属性绑定到svg文本元素的长度，以便在每次更改文本时都进行设置。我从以下内容开始：

ko.bindingHandlers.length = {
    init: function(element, valueAccessor, allBindingsAccessor, viewModel) {
        var width = element.getComputedTextLength();
        valueAccessor()(width);
        element.onchange = function() {
            var newWidth = element.getComputedTextLength();
            valueAccessor()(newWidth);
        };
    }
};

还有svg元素

<text data-bind="text: text, length: labelLength" x="0" y="0" fill="black">Hello World</text> 

你好，世界

杰弗里德尔来了

---

你知道最好的方法吗？

如果你想在文本改变时设置元素的宽度，你可以使用一个计算的可观察值（fiddle:）：

或者要在设置文本后获取文本元素的宽度？如果是这种情况，您可以像这样更改自定义绑定（fiddle:）：

var model = function(){
    this.text = ko.observable("Hello World");
    this.labelLength = ko.computed(function(){
        return this.text().length * 10;
    });
    this.changeText = function(){
        this.text("This is some much longer text");
    }
}

ko.bindingHandlers.textSetLength = {
    init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
    },
    update: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
        $(element).text(valueAccessor()());
        var width = $(element)[0].getBoundingClientRect().width;
        this.labelLength(width);
    }
};