2pt70a
Last Updated: February 25, 2016
·
3.044K
· otupman
45975fcc42c585f7ddd9711e1f5198a7

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>

1 Response
Add your response

10620
Bb856ffba50c5f25304d74027c94fa30

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.

over 1 year ago ·