How to detect click anywhere on the page by Typescript (Angular2)

Question

How to detect click anywhere on the page by Typescript? in AngularJS 2

See also http://stackoverflow.com/questions/35527456/angular2-window-resize-event/35527852#35527852 — Günter Zöchbauer, Apr 05 '17 at 15:13

score 18 · Accepted Answer · answered Apr 05 '17 at 14:59

18

You can scope a HostListener to the document.

import { Component, HostListener } from '@angular/core'    

class MyComponent {

    @HostListener('document:click', ['$event'])
    documentClick(event: MouseEvent) {
        // your click logic
    }
}

answered Apr 05 '17 at 14:59

adharris

3,591
1
21
18

thanks for the answer! I got error on documentClick. Any idea why? – Nasim Mokhtar Apr 05 '17 at 15:01
documentClick(event: MouseEvent) { this.show = false; this.changeDetectorRef.detectChanges(); } – Nasim Mokhtar Apr 05 '17 at 15:02
What is the error you're getting? – adharris Apr 05 '17 at 15:03
Cannot find name 'documentClick' – Nasim Mokhtar Apr 05 '17 at 15:05
That error doesn't make sense to me; are you trying to call that function somewhere else? – adharris Apr 05 '17 at 15:08
I fixed it! now I need to use this method in another method. What should I pass as a parameter? this.documentClick('click?'); – Nasim Mokhtar Apr 05 '17 at 15:28

How to detect click anywhere on the page by Typescript (Angular2)

1 Answers1

Linked