Instantly share code, notes, and snippets.

🎯
Focusing

Netanel Basal NetanelBasal

View GitHub Profile
View ee11.html
<div *ngFor="let item of items" (click.delegate)="delegate($event, item)">
{{item.name}}
</div>
View ee9.ts
const eventDelegation = {
map: new Map(),
init: false,
supports(eventName: string) {
return eventName.includes("delegate");
},
addEventListener(
element,
eventName,
originalHandler
View ee7.ts
const outsideZone = {
supports(eventName: string) {
return eventName.includes("outside-zone");
},
addEventListener(
element,
eventName,
originalHandler
) {
this.manager.getZone().runOutsideAngular(() => {
View ee6.ts
@Injectable({
providedIn: "root"
})
export class DeferEventPlugin {
manager: EventManager;
supports(eventName: string): boolean {
return /debounce|throttle/.test(eventName);
}
View ee5.html
<input (keyup.debounce)="doSomething($event)">
<input (keyup.debounce.500)="doSomething($event)">
<input (windo:scroll.throttle)="doSomething($event)">
View ee4.ts
_findPluginFor(eventName: string): EventManagerPlugin {
const plugins = this._plugins;
for (let i = 0; i < plugins.length; i++) {
const plugin = plugins[i];
if (plugin.supports(eventName)) {
this._eventNameToPlugin.set(eventName, plugin);
return plugin;
}
}
throw new Error(`No event manager plugin found for event ${eventName}`);
View ee3.ts
@Injectable()
export class EventManager {
constructor(@Inject(EVENT_MANAGER_PLUGINS) plugins: EventManagerPlugin[], private _zone: NgZone) {
plugins.forEach(p => p.manager = this);
this._plugins = plugins.slice().reverse();
}
addEventListener(element: HTMLElement, eventName: string, handler: Function): Function {
const plugin = this._findPluginFor(eventName);
View ee2.ts
import { EVENT_MANAGER_PLUGINS } from "@angular/platform-browser";
@NgModule({
providers: [
{
multi: true,
provide: EVENT_MANAGER_PLUGINS,
useClass: MyPlugin
}
],
View ee1.ts
listen(target, event, callback) {
if (typeof target === 'string') {
return this.eventManager.addGlobalEventListener(
target, event, decoratePreventDefault(callback));
}
return this.eventManager.addEventListener(
target, event, decoratePreventDefault(callback));
}
View pf2.ts
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';