knockout.js - KnockoutJs "with"和自定义绑定(bind)处理程序

Question

我的模型是这样的

var model function(json) {
    var self = this;

    self.Editing = ko.observable();
    self.Edit = function(item) {
        item.beginEdit();
        self.Editing(item);
    }
    self.Save = function(item) {
       item().commit();
       self.Editing(null);
    }
    self.Cancel = function(item) {
       item().rollback();
       self.Editing(null);
    }

    ko.mapping.fromJS(json, {}, this);
}

我还有一些 jquery-ui 的自定义绑定(bind)

ko.bindingHandlers.jqDialog = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
    var options = $.extend(
             {}, 
             allBindingsAccessor().dialogOptions, 
             { autoOpen: false, modal: true, width: 'auto' });

    ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
        $(element).dialog("destroy");
    });

    $(element)
        .dialog(options)
        .children('form:first')
        .ajaxForm({ configure ajax call });
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
    var value = ko.utils.unwrapObservable(valueAccessor());
    if (value === null) {
        $(element).dialog('close');
    }
    else {
        var title = $(element).data('title') + ' - ' + value.Title;
        $(element).dialog('option', 'title', title).dialog('open');
    }
}
};

最后是我的模板

...standard binding that works...
...foreach template binding that works...
<div data-bind="with: Editing, jqDialog: Editing" data-title="Edit">
  <form method="put" action="/api/Item" data-bind="submit: $parent.Save">
    <input type="hidden" name="Id" data-bind="value: Id" />
    <div>
      <label>Enter the Value</label>
      <input name="thevalue" data-bind="value: thevalue" />
    </div>
    <input type="submit" value="Save" data-bind="jqButton: {}" />
    <a href="#" data-bind="click: $parent.Cancel, jqButton: {}">Cancel</a>
  </form>
</div>

问题:使用绑定(bind) data-bind="with: Editing, jqDialog: Editing" 对话框会出现，但缺少输入和按钮。它基本上是一个带有正确标题的空对话框。

如果我将绑定(bind)更改为 data-bind="with: Editing"，则数据会正确绑定(bind)到标记，但我会松开对话框。我假设问题出在 jqDialog 的处理程序中，但我不确定缺少什么才能使它正常工作。

Answer 1

我猜这会起作用(请参阅我在评论中的可能解释):

<!--ko with: Editing-->
  <div data-bind="jqDialog: $data" data-title="Edit">
    ...
  </div>
<!--/ko-->