ng2-events/lib/observe/observe.event.js

Supercharge your Angular2+ event handling

"use strict";
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        if (typeof b !== "function" && b !== null)
            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
Object.defineProperty(exports, "__esModule", { value: true });
exports.ObserveEventPlugin = void 0;
var core_1 = require("@angular/core");
var common_1 = require("@angular/common");
var rxjs_1 = require("rxjs");
var event_manager_plugin_1 = require("../__util/event-manager-plugin");
var i0 = require("@angular/core");
/**
 * Control event listeners with an observable operator without triggering change detection
 * every time the event fires
 *
 * Usage:
 * <button (observe.throttleTime-500.click)="foo()"></button>
 *
 * The method used must be present on the Observable object
 * e.g. through an explicit import:
 * import 'rxjs/add/operator/throttleTime';
 *
 *
 * To get finer-grained control and the possibility to add multiple observable operators
 * use the ObserveEventDirective.
 */
var ObserveEventPlugin = /** @class */ (function (_super) {
    __extends(ObserveEventPlugin, _super);
    function ObserveEventPlugin(doc) {
        return _super.call(this, doc) || this;
    }
    ObserveEventPlugin.prototype.supports = function (eventName) {
        return eventName.indexOf('observe.') === 0;
    };
    ObserveEventPlugin.prototype.addEventListener = function (element, eventName, handler) {
        var _this = this;
        return this.manager.getZone().runOutsideAngular(function () {
            var eventRest = eventName.slice(8).split('.');
            var fnParts = eventRest[0].split('-');
            var fnName = fnParts[0];
            var fnArg = (fnParts.length > 1) ? +fnParts[1] : undefined;
            var delegateEvent = eventRest.slice(1).join('.');
            var subject = new rxjs_1.Subject();
            var observable = subject.asObservable();
            if (observable[fnName]) {
                observable = (fnArg !== undefined)
                    ? observable[fnName](fnArg)
                    : observable[fnName]();
            }
            else {
                console.error('The function "' + fnName + '" does not exist on Observable!');
                return function () { };
            }
            observable.subscribe(function (x) { return _this.manager.getZone().run(function () { return handler(x); }); });
            var listener = _this.manager.addEventListener(element, delegateEvent, function ($event) {
                subject.next($event);
            });
            return function () {
                listener();
                subject.complete();
            };
        });
    };
    ObserveEventPlugin.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.2", ngImport: i0, type: ObserveEventPlugin, deps: [{ token: common_1.DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
    ObserveEventPlugin.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.0.2", ngImport: i0, type: ObserveEventPlugin });
    return ObserveEventPlugin;
}(event_manager_plugin_1.MyEventManagerPlugin));
exports.ObserveEventPlugin = ObserveEventPlugin;
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.2", ngImport: i0, type: ObserveEventPlugin, decorators: [{
            type: core_1.Injectable
        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                    type: core_1.Inject,
                    args: [common_1.DOCUMENT]
                }] }]; } });