2017-02-08 4 views
1

나는 angular2와 devextreme을 angular2로 사용하고 있습니다. 나는 이벤트 핸들러는 HTML 요소에 첨부 할 것을 요구 자신의 사이트에 대한 질문에서 일부 기능을 추가하려고DOM 이벤트를 동적으로 연결하는 Angular2

$('html').on('dxclick', function(event) { 
     console.log('DxClick - Clicked'); 
    }); 

분명히이는 눈살을 찌푸리게 될 angular2에있는, 그래서 해결하려고 노력하고있다 그것을 올바르게하는 방법. 그러나, 예외

public ngAfterViewInit() { 
    let htmlElement: any = this.elementRef.nativeElement; 
    while (htmlElement && htmlElement.localName !== 'html') { 
     htmlElement = htmlElement.parentNode; 
    } 

    if (htmlElement) { 
     this.eventManager.addEventListener(htmlElement, 'dxclick', function (event: any) { 
      console.log('DxClick Clicked'); 
     }); 
    } 
} 

이 코드는 HTML 요소를 찾고에서 addEventListener이 성공적으로 실행

constructor(@Inject(EventManager) private eventManager: EventManager) { 
    this.eventManager.addGlobalEventListener('html', 'dxclick', function(event: any) { 
     console.log('DxClick Clicked'); 
    }); 
} 
이 그냥 원인

과 "정의의 읽을 수 없습니다 재산 '또는 addEventListener'"나는 다음을 시도했습니다 콜백 함수는 결코 실행되지 않습니다.

jQuery 코드를 재현 할 수 있습니까? 그렇다면 무엇을 놓쳤습니까?

답변

0

다음 구문을 사용하여 구성 요소 내의 전역 이벤트에 연결할 수 있습니다. 크기 조정 이벤트 :

@HostListener('window:resize') 
resizeWindow() { 
    // window has been resized 
} 
+0

이것은 또한 "정의되지 않은"예외의 'addEventListener'속성을 읽을 수 없습니다. html이 HostListener의 유효한 대상이 아닌 것 같습니다. – ciantrius