Mod+v How I can get $event.originalEvent ?

[arturgspb]

Hi!

I work with ng-paste="onPaste($event)" Angular pass $event with $event.originalEvent in my function. HotKeys pass another object.

I need it for get clipboardData on "mod+v".

Function for read clipboard content

        srv.getText = function ($event) {
            // http://stackoverflow.com/questions/33691020/how-to-get-clipboard-data-on-copy-paste-events
            var text;
            if ($window.clipboardData) { //IE
                text = $window.clipboardData.getData('Text');
            } else if ($event.originalEvent.clipboardData) {
                try {
                    text = $event.originalEvent.clipboardData.getData('text/plain');
                } catch (ex) {
                    text = undefined;
                }
            }
            if (text) {
                $event.preventDefault();
            }
            return text;
        };

Subj.

[aramando]

@arturgspb The event object passed as the first argument to hotkey callbacks is the original DOM event, it's just that it's of a different type to the one that Angular wraps in its own event object, i.e. it's a KeyboardEvent, not a ClipboardEvent. The ClipboardEvent you want is only generated later on, after the KeyboardEvent bubbles up and triggers the browser to perform a paste. So ngPaste is really the more appropriate way of registering a handler for a paste event that needs access to the clipboard data, and of course that will automatically be bound to the mod+v combo you want.

However, if you're really set on doing this via hotkeys for some reason, then you need to use the hotkey callback to register another listener for the paste event, something like this:

    // in your controller, with the $clipboard service and $scope injected

    $scope.text = '';

    hotkeys.bindTo($scope).add({
        combo: 'ctrl+v',
        callback: function(e, combo) {
            document.addEventListener('paste', handlePaste, false);
        }
    });

    function handlePaste(e) {
        document.removeEventListener('paste', handlePaste);       
        $scope.text = $clipboard.getText(e);
    }

Note that you will also need to modify the getText method so that it can accept either an Angular event or the original DOM event, so that it can work as a handler for the ngPaste directive or a hotkey.

function Clipboard($window) {
    this.getText = function (event) {
        // make compatible with both Angular and DOM events:
        var domEvent = event.originalEvent || event;
        var text;
        if ($window.clipboardData) { //IE
            text = $window.clipboardData.getData('Text');
        } else if (domEvent.clipboardData) {
            try {
                text = domEvent.clipboardData.getData('text/plain');
            } catch (ex) {
                text = undefined;
            }
        }
        if (text) {
            event.preventDefault();
        }
        return text;
    };
}
angular.module("ngClipboard", []).service("$clipboard", Clipboard);