@reactivex/rxjs

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <base data-ice="baseUrl" href="../../../"> <title data-ice="title">es6/observable/FromEventObservable.js | RxJS API Document</title> <link type="text/css" rel="stylesheet" href="css/style.css"> <link type="text/css" rel="stylesheet" href="css/prettify-tomorrow.css"> <script src="script/prettify/prettify.js"></script> <script src="script/manual.js"></script> <script data-ice="userScript" src="user/script/0-Rx.js"></script> <script data-ice="userScript" src="user/script/1-devtools-welcome.js"></script> <script data-ice="userScript" src="user/script/2-custom-manual-styles.js"></script> <script data-ice="userScript" src="user/script/3-decision-tree-widget.min.js"></script> <script data-ice="userScript" src="user/script/4-theme-toggler.js"></script> <link data-ice="userStyle" rel="stylesheet" href="user/css/0-main.css"> </head> <body class="layout-container" data-ice="rootContainer"> <header> <a href="./">Home</a> <a href="./manual/index.html" data-ice="manualHeaderLink">Manual</a> <a href="identifiers.html">Reference</a> <a href="source.html">Source</a> <a href="test.html" data-ice="testLink">Test</a> <a data-ice="repoURL" href="https://github.com/ReactiveX/RxJS" class="repo-url-github">Repository</a> <div class="search-box"> <span> <img src="./image/search.png"> <span class="search-input-edge"></span><input class="search-input"><span class="search-input-edge"></span> </span> <ul class="search-result"></ul> </div> </header> <nav class="navigation" data-ice="nav"><div> <ul> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-AsyncSubject">AsyncSubject</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-BehaviorSubject">BehaviorSubject</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-Notification">Notification</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-Observable">Observable</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-ReplaySubject">ReplaySubject</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-Scheduler">Scheduler</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-AnonymousSubject">AnonymousSubject</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-Subject">Subject</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-SubjectSubscriber">SubjectSubscriber</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-Subscriber">Subscriber</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-Subscription">Subscription</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-typedef">T</span><span data-ice="name"><span><a href="typedef/index.html#static-typedef-Rx.Scheduler">Rx.Scheduler</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-typedef">T</span><span data-ice="name"><span><a href="typedef/index.html#static-typedef-Rx.Symbol">Rx.Symbol</a></span></span></li> <li data-ice="doc"><div data-ice="dirPath" class="nav-dir-path">observable</div><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-ConnectableObservable">ConnectableObservable</a></span></span></li> <li data-ice="doc"><div data-ice="dirPath" class="nav-dir-path">observable/dom</div><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-AjaxError">AjaxError</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-AjaxResponse">AjaxResponse</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-AjaxTimeoutError">AjaxTimeoutError</a></span></span></li> <li data-ice="doc"><div data-ice="dirPath" class="nav-dir-path">operator</div><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-GroupedObservable">GroupedObservable</a></span></span></li> <li data-ice="doc"><div data-ice="dirPath" class="nav-dir-path">scheduler</div><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-Action">Action</a></span></span></li> <li data-ice="doc"><div data-ice="dirPath" class="nav-dir-path">util</div><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-ArgumentOutOfRangeError">ArgumentOutOfRangeError</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-EmptyError">EmptyError</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-ObjectUnsubscribedError">ObjectUnsubscribedError</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-TimeoutError">TimeoutError</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-UnsubscriptionError">UnsubscriptionError</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-root">root</a></span></span></li> </ul> </div> </nav> <div class="content" data-ice="content"><h1 data-ice="title">es6/observable/FromEventObservable.js</h1> <pre class="source-code line-number raw-source-code"><code class="prettyprint linenums" data-ice="content">import { Observable } from '../Observable'; import { tryCatch } from '../util/tryCatch'; import { isFunction } from '../util/isFunction'; import { errorObject } from '../util/errorObject'; import { Subscription } from '../Subscription'; function isNodeStyleEventEmmitter(sourceObj) { return !!sourceObj && typeof sourceObj.addListener === 'function' && typeof sourceObj.removeListener === 'function'; } function isJQueryStyleEventEmitter(sourceObj) { return !!sourceObj && typeof sourceObj.on === 'function' && typeof sourceObj.off === 'function'; } function isNodeList(sourceObj) { return !!sourceObj && sourceObj.toString() === '[object NodeList]'; } function isHTMLCollection(sourceObj) { return !!sourceObj && sourceObj.toString() === '[object HTMLCollection]'; } function isEventTarget(sourceObj) { return !!sourceObj && typeof sourceObj.addEventListener === 'function' && typeof sourceObj.removeEventListener === 'function'; } /** * We need this JSDoc comment for affecting ESDoc. * @extends {Ignored} * @hide true */ export var FromEventObservable = (function (_super) { __extends(FromEventObservable, _super); function FromEventObservable(sourceObj, eventName, selector, options) { _super.call(this); this.sourceObj = sourceObj; this.eventName = eventName; this.selector = selector; this.options = options; } /* tslint:enable:max-line-length */ /** * Creates an Observable that emits events of a specific type coming from the * given event target. * * <span class="informal">Creates an Observable from DOM events, or Node * EventEmitter events or others.</span> * * <img src="./img/fromEvent.png" width="100%"> * * Creates an Observable by attaching an event listener to an "event target", * which may be an object with `addEventListener` and `removeEventListener`, * a Node.js EventEmitter, a jQuery style EventEmitter, a NodeList from the * DOM, or an HTMLCollection from the DOM. The event handler is attached when * the output Observable is subscribed, and removed when the Subscription is * unsubscribed. * * @example <caption>Emits clicks happening on the DOM document</caption> * var clicks = Rx.Observable.fromEvent(document, 'click'); * clicks.subscribe(x => console.log(x)); * * @see {@link from} * @see {@link fromEventPattern} * * @param {EventTargetLike} target The DOMElement, event target, Node.js * EventEmitter, NodeList or HTMLCollection to attach the event handler to. * @param {string} eventName The event name of interest, being emitted by the * `target`. * @param {EventListenerOptions} [options] Options to pass through to addEventListener * @param {SelectorMethodSignature<T>} [selector] An optional function to * post-process results. It takes the arguments from the event handler and * should return a single value. * @return {Observable<T>} * @static true * @name fromEvent * @owner Observable */ FromEventObservable.create = function (target, eventName, options, selector) { if (isFunction(options)) { selector = options; options = undefined; } return new FromEventObservable(target, eventName, selector, options); }; FromEventObservable.setupSubscription = function (sourceObj, eventName, handler, subscriber, options) { var unsubscribe; if (isNodeList(sourceObj) || isHTMLCollection(sourceObj)) { for (var i = 0, len = sourceObj.length; i < len; i++) { FromEventObservable.setupSubscription(sourceObj[i], eventName, handler, subscriber, options); } } else if (isEventTarget(sourceObj)) { var source_1 = sourceObj; sourceObj.addEventListener(eventName, handler, options); unsubscribe = function () { return source_1.removeEventListener(eventName, handler); }; } else if (isJQueryStyleEventEmitter(sourceObj)) { var source_2 = sourceObj; sourceObj.on(eventName, handler); unsubscribe = function () { return source_2.off(eventName, handler); }; } else if (isNodeStyleEventEmmitter(sourceObj)) { var source_3 = sourceObj; sourceObj.addListener(eventName, handler); unsubscribe = function () { return source_3.removeListener(eventName, handler); }; } else { throw new TypeError('Invalid event target'); } subscriber.add(new Subscription(unsubscribe)); }; FromEventObservable.prototype._subscribe = function (subscriber) { var sourceObj = this.sourceObj; var eventName = this.eventName; var options = this.options; var selector = this.selector; var handler = selector ? function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i - 0] = arguments[_i]; } var result = tryCatch(selector).apply(void 0, args); if (result === errorObject) { subscriber.error(errorObject.e); } else { subscriber.next(result); } } : function (e) { return subscriber.next(e); }; FromEventObservable.setupSubscription(sourceObj, eventName, handler, subscriber, options); }; return FromEventObservable; }(Observable)); //# sourceMappingURL=FromEventObservable.js.map</code></pre> </div> <footer class="footer"> Generated by <a href="https://esdoc.org">ESDoc<span data-ice="esdocVersion">(0.4.8)</span></a> </footer> <script src="script/search_index.js"></script> <script src="script/search.js"></script> <script src="script/pretty-print.js"></script> <script src="script/inherited-summary.js"></script> <script src="script/test-summary.js"></script> <script src="script/inner-link.js"></script> <script src="script/patch-for-local.js"></script> </body> </html>