diff options
author | crupest <crupest@outlook.com> | 2019-03-11 00:07:59 +0800 |
---|---|---|
committer | crupest <crupest@outlook.com> | 2019-03-11 00:07:59 +0800 |
commit | f8cfca136a69c6589bb610a66ea5342fc585f19b (patch) | |
tree | a14bfc3d1d12e6852c0f383142b0a78a2f98a180 /Timeline/ClientApp/src/app/utilities/debounce-click.directive.ts | |
parent | 233de3a11027fd88130882f20764ee5f2952abe0 (diff) | |
download | timeline-f8cfca136a69c6589bb610a66ea5342fc585f19b.tar.gz timeline-f8cfca136a69c6589bb610a66ea5342fc585f19b.tar.bz2 timeline-f8cfca136a69c6589bb610a66ea5342fc585f19b.zip |
Write unit tests.
Diffstat (limited to 'Timeline/ClientApp/src/app/utilities/debounce-click.directive.ts')
-rw-r--r-- | Timeline/ClientApp/src/app/utilities/debounce-click.directive.ts | 39 |
1 files changed, 39 insertions, 0 deletions
diff --git a/Timeline/ClientApp/src/app/utilities/debounce-click.directive.ts b/Timeline/ClientApp/src/app/utilities/debounce-click.directive.ts new file mode 100644 index 00000000..feb0404e --- /dev/null +++ b/Timeline/ClientApp/src/app/utilities/debounce-click.directive.ts @@ -0,0 +1,39 @@ +import { Directive, Output, Input, EventEmitter, ElementRef, OnInit, OnDestroy } from '@angular/core'; +import { fromEvent, Subscription } from 'rxjs'; +import { debounceTime } from 'rxjs/operators'; + +@Directive({ + selector: '[appDebounceClick]' +}) +export class DebounceClickDirective implements OnInit, OnDestroy { + + private subscription: Subscription; + + @Output('appDebounceClick') clickEvent = new EventEmitter<any>(); + + // tslint:disable-next-line:no-input-rename + @Input('appDebounceClickTime') + set debounceTime(value: number) { + if (this.subscription) { + this.subscription.unsubscribe(); + } + this.subscription = fromEvent(<HTMLElement>this.element.nativeElement, 'click').pipe( + debounceTime(value) + ).subscribe(o => this.clickEvent.emit(o)); + } + + constructor(private element: ElementRef) { + } + + ngOnInit() { + if (!this.subscription) { + this.subscription = fromEvent(<HTMLElement>this.element.nativeElement, 'click').pipe( + debounceTime(500) + ).subscribe(o => this.clickEvent.emit(o)); + } + } + + ngOnDestroy() { + this.subscription.unsubscribe(); + } +} |