Как реализовать связывание textInput с входным текстом OJET v5.2.0?

Question

Связывание Knockout textInput, используемое для работы с тегом Oracle JET v3.2.0 ojInputText.

<input id="text-input" 
     type="text"
     data-bind="ojComponent: {component: 'ojInputText', 
                              textInput: value}"/>

Но теперь, когда каждый компонент Oracle JET v5.2.0 является пользовательским компонентом HTML, textInput больше не работает. Я пробовал эти методы:

<oj-input-text id="text-input" textInput="{{value}}"></oj-input-text>
<oj-input-text id="text-input" data-bind="textInput: value"></oj-input-text>

Есть ли способ заставить textInput работать с oj-input-text?

Я также проверил документацию , но ничего не упоминается.

Answer 1

Как подтвердил @Srishti, я не могу использовать textInput с Oracle JET. Поэтому я создал обработчик привязки для нокаута, чтобы имитировать поведение, которое, как я полагаю, другим тоже будет полезно:

<oj-input-text data-bind="textInputOJET: value"></oj-input-text>

JS:

ko.bindingHandlers.textInputOJET = {
    init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
        $(element).focus(function(){
            $($(this).find('input')[0]).keyup(function(event){
                valueAccessor()(event.currentTarget.value);
            });
        });
    },
    update: function(element, valueAccessor, allBindings, viewModel, bindingContext) {}
}

self.value = ko.observable();
self.value.subscribe(function(newValue){
    console.log(newValue);
});

Answer 2

Это невозможно, и вы можете понять, почему, когда вы проверяете библиотеку. В ojinputtext.js функция _onKeyUpHandler специально слушает только клавишу ввода и ничего больше.

 _onKeyUpHandler : function (event) 
    {           
       if(event.keyCode === $.ui.keyCode.ENTER){
            this._SetValue(this._GetDisplayValue(), event);             
       }
    }

Также невозможно изменить эту функцию из вашей viewModel, поскольку ojinputtext регистрируется как составной компонент в конце в OJET, и только тогда вы получаете доступ к нему.

  oj.CustomElementBridge.registerMetadata('oj-input-text', 'inputBase', ojInputTextMeta);
  oj.CustomElementBridge.register('oj-input-text', 
                         {'metadata': oj.CustomElementBridge.getMetadata('oj-input-text')});

Возможно, вы могли бы обойти обход Jquery-функции вокруг входного текста, который слушает каждое нажатие клавиши.