手动调用淘汰扩展器中的方法

Question

我找不到任何可行的解决方案来解决我的问题，但我知道这可能是让它正常工作的一种简单方法，但我无法弄清楚。

我有一个名为 liveEditor 的扩展器，它在显示文本和用户可以输入值的输入之间切换。它适用于输入和文本区域，但我无法使用日期选择器来管理它。

这是我的代码

HTML：

<div data-bind="liveEditor: Date">
  <span class="view" data-bind="text: Date, event: {click: Date.edit}">15.04.2016</span>
  <span data-bind="event: { click: Date.stopEditing }" class="ok"></span>
  <input value="15.04.2016" data-bind="datetime: Date, event: {blur: Date.stopEditing}" />
</div>

JS：

ko.extenders.liveEditor = function (target) {
    target.editing = ko.observable(false);
    target.edit = function () {
        target.editing(true);
    };

    target.stopEditing = function () {
        target.editing(false);

        //save
        this.saveModel(); //run a method on viewmodel
    };
    return target;
};

ko.bindingHandlers.datetime = {
    init: function(element, valueAccessor,  allBindings, viewModel, bindingContext){
        var value = valueAccessor();
        var $el = $(element);

        if (ko.isObservable( value )){

            $el.data('kendoDatePicker').on('close', function(e,dataItem){
                // what should I write here to call a stopEditing method?
            });
        }
    }
};

当我单击“确定”按钮时它可以工作。

提前感谢您的帮助！

Answer 1

我应该在这里写什么来调用 stopEditing 方法？

observable 可从valueAccessor() 获得，所以：

valueAccessor().stopEditing();

这将在事件发生时访问它。如果您使用调用 init 时的值很重要，那么您将在 avlue 中关闭它，因此它将是 value.stopEditing()。

你有另外两个选择（但我想我会做上面的）：

• 您可以从allBindings 访问events 绑定，然后获取它的blur 绑定并调用它
• 您可以在input 上触发blur 事件