AngularJs2 在组件中获取元素的 find() 方法
AngularJs2 get the find() method in component for element
我想在这里检查,如果用户在我的 "DropdownComponent" 元素之外单击而不是隐藏一些数据。但是 "this.templateRef.nativeElement.find" 我无法在 angularJS2 中获得 "find()" 方法。
import { Component, EventEmitter, ElementRef, Output, HostListener } from '@angular/core';
export class DropdownComponent{
showValue = true;
constructor(private templateRef: ElementRef) {
};
@HostListener('document:click', ['$event'])
handleKeyboardEvent(kbdEvent: any) {
console.log("---"+ kbdEvent);
var isClickedElementChildOfDropdownComponent = this.templateRef.nativeElement.find(kbdEvent.target).length > 0;
if(isClickedElementChildOfDropdownComponent ) {
return;
}
this.showValue = false;
}
}
使用contains
,
@HostListener('document:click', ['$event'])
handleKeyboardEvent(kbdEvent: any) {
var isClickOutside = !this.templateRef.nativeElement.contains(kbdEvent.target);
if(isClickOutside) {
return;
}
this.showValue = false;
}
我想在这里检查,如果用户在我的 "DropdownComponent" 元素之外单击而不是隐藏一些数据。但是 "this.templateRef.nativeElement.find" 我无法在 angularJS2 中获得 "find()" 方法。
import { Component, EventEmitter, ElementRef, Output, HostListener } from '@angular/core';
export class DropdownComponent{
showValue = true;
constructor(private templateRef: ElementRef) {
};
@HostListener('document:click', ['$event'])
handleKeyboardEvent(kbdEvent: any) {
console.log("---"+ kbdEvent);
var isClickedElementChildOfDropdownComponent = this.templateRef.nativeElement.find(kbdEvent.target).length > 0;
if(isClickedElementChildOfDropdownComponent ) {
return;
}
this.showValue = false;
}
}
使用contains
,
@HostListener('document:click', ['$event'])
handleKeyboardEvent(kbdEvent: any) {
var isClickOutside = !this.templateRef.nativeElement.contains(kbdEvent.target);
if(isClickOutside) {
return;
}
this.showValue = false;
}