Измените значение ввода на прокрутке мыши с помощью knockout.js

Question

У меня есть несколько входов в моем представлении html, и я хотел бы добавить такую ​​функциональность: когда вы наводите курсор на ввод, и вы используете прокрутку мыши, значение этого входные изменения (выбирает другой индекс из массива для ввода текста или значение восхождения/уменьшения для числовых). Использование привязки event не очень для меня, поскольку я использую разные режимы просмотра для этих входов и разных настроек, поэтому я думал об использовании расширителя, который расширяет видимое значение, но я действительно не знаю, как настроить таргетинг на события (mousescroll над элементом) в этом расширителе. Является ли удлинитель правильным способом, или я должен вместо этого придерживаться этих привязок event на стороне просмотра?

Answer 1

Я считаю, что пользовательский обработчик привязки - это путь. Вся модель для связи с DOM должна выполняться с помощью обработчиков. Расширители - это всего лишь способ добавить дополнительную функциональность к наблюдаемому. Ниже приведен пример такого обработчика:

ko.bindingHandlers.wheel = { 
    init: function(element, valueAccessor) { 
     var value = valueAccessor(); 
     var handler = function (e) { 
       var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));    
       value(value() + delta); 
     }; 
     // IE9, Chrome, Safari, Opera 
     element.addEventListener("mousewheel", handler, false); 
     // Firefox 
     element.addEventListener("DOMMouseScroll", handler, false); 
    } 
}; 

Working fiddle