2017-02-02 1 views
0

Ich habe eine Google Maps, die keyup Ereignisse erfassen sollte. Meine Komponente ist ein Elternteil des Google Maps-DIV. Es funktioniert gut mit Chrome, nicht mit Firefox oder IE (nicht mit Edge getestet).Keyup-Ereignis nicht mit Angular 2 gefangen @HostListener

Meine Komponente:

@Component({ 
    selector: 'dashboard', 
    templateUrl: 'dashboard.component.html', 
    styleUrls: ['dashboard.component.css'], 
    host: { 
    '[attr.tabindex]': '-1' 
    }, 
    providers: [] 
}) 
export class DashboardComponent implements OnInit{ 

    /* some functions and other stuff here 
    * ... 
    */ 

    @HostListener('keyup', ['$event']) keyup(e) { 
    console.log('This will be called with Chrome, not with the others.'); 
    } 
}; 

Sie das gleiche erlebt Haben? (Sagen Sie mir, wenn Sie weitere Informationen benötigen). Dank

[Bearbeiten]
Ich habe versucht, die keyup Ereignisse fangen von ElementRef mit und Einstellung meiner Event-Handler auf die onkeyup Eigenschaft des elementRef.nativeElement, ohne Glück

Antwort

0

Aus irgendeinem Grund Chrome propogates das KeyUp-Ereignis zum Elternteil, während andere Browser nicht. Sie können versuchen, das Ereignis der Karte direkt zu abonnieren.

@ViewChild('myMap') 
map: ElementRef; 

constructor(private renderer: Renderer) {}; 

ngOnInit() { 
    this.renderer.listen(this.map.nativeElement, 'keyup', (event) => { 
     // ... 
    }); 
} 

und in der Vorlage:

<div #myMap>...</div> 
+0

Leider funktioniert das nicht. Ich habe 'tabindex =" - 1 "' hinzugefügt. Es funktioniert immer noch mit Chrome. –

3

Versuchen Sie, die window:keyup oder document:keyup Ereignis statt einfach keyup hören.

Source

Verwandte Themen