요소 div에서 스크롤 이벤트가 발생하지 않습니다.

Question

각도 요소의 템플릿 안에 div가 있습니다. div에서 div의 스크롤 위치를 얻으려고합니다.

<div class="data-input" (scroll)="onScroll($event)">Accepted Qty....</div> 

html 요소는 다음과 같습니다. 는 TS 파일

내가 함수

onScroll(event) { 
    console.log(event); 
} 

을 가지고 있지만이 기능을 타격하지 않습니다.

내가 이미

@HostListener('scroll', ['$event']) 
onScroll(event) { ...} 

을 시도했지만이 때 페이지 스크롤을 사용할 수 있습니다. html 요소 (div) 스크롤 할 때 스크롤 이벤트를 트리거 할 싶습니다.

Answer 1

ElementRef 및 Renderer으로 시도 할 수 있습니다.

import {Component, OnInit, OnDestroy} from '@angular/core'; 
import {ElementRef, Renderer2} from '@angular/core'; 

@Component({ 
    selector: 'my-scroll', 
    template: '<div>Accepted Qty....</div>' 
}) 

export class MyScrollComponent implements OnInit, OnDestroy { 

    onScrollListener: Function; 

    constructor(private elementRef: ElementRef, private renderer: Renderer2) { 
    } 

    ngOnInit() { 
    this.onScrollListener = 
     this.renderer.listen(this.elementRef.nativeElement, 'scroll', this.onScroll); 
    } 

    ngOnDestroy() { 
    this.onScrollListener(); 
    } 

    onScroll(event) { 
    console.log(event); 
    } 
}