Knockout.js & Lungo.js - taps instead of clicks
Knockout.js provides a some "events" such as click, submit, etc.
<div data-bind="click: clickHandler"></div>
Unfortunately (or fortunately) when it comes to Lungo.js (and Quo.js) there are no clicks, just touch events. So how to solve this issue?
Knockout provides you with the data binding "event" that allows you to bind to specific events via this syntax: (taken from the KO event binding page: http://knockoutjs.com/documentation/event-binding.html)
<div data-bind="event: { tap: tapHandler}"></div>
Which would work fine, however seeing how all the interaction events will be taps it seems a little redundant to have to specify the extra blurb; the following code will create a 'tap' binding:
ko.bindingHandlers.tap = {
init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
var callback = allBindingsAccessor().tap;
$$(element).tap(function() {
callback(viewModel);
});
}
, update: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {}
}
And to use, just replace 'click' with 'tap':
<div data-bind="tap: tapHandler"></div>
Written by Oliver Tupman
Related protips
1 Response
You can also check this - https://github.com/yaroslavya/knockouch
This plugin / extension adds touch event capability to KnockoutJS. You can add other touch event libs to it too.