knockout.js - 使用 knockout.js 和可拖动更新样式“LEFT”

Question

我想在拖动时更新左侧属性，但拖动时我的属性仍然显示 50。我知道我做的不对，有什么帮助吗？

games: ko.observableArray([
 { left: ko.observable(50) },
 { left: ko.observable(50) },
 { left: ko.observable(50) }
];

<div class="bracket-game" data-bind="bracketGameInit: { left: left }">



ko.bindingHandlers.bracketGameInit = {
        init: function (element, valueAccessor) {

            var values = ko.utils.unwrapObservable(valueAccessor());
            $(element).draggable();
            ko.bindingHandlers.style.update(element, function () { return { left: (values.left() + 'px') }; });

        }
    };

Answer 1

我认为您会想要响应可拖动drag事件（或者stop如果您只想在最后更新它）。

也许是这样的：

ko.bindingHandlers.bracketGameInit = {
    init: function (element, valueAccessor) {
        var left = valueAccessor();

        $(element).draggable({
            drag: function(event, ui) {
                left(ui.position.left);
            }                    
        });
    },
    update: function(element, valueAccessor) {
        var left = valueAccessor();
        $(element).css("left", left());
    }
};

这是一个示例：http: //jsfiddle.net/rniemeyer/Na8K7/