2017-10-29 4 views
2

매트 sidenav 컨테이너에서 스크롤 이벤트를 감지하는 방법 때 각 재료 매트 sidenav 컨테이너 스크롤 2.내가 검색하는 방법을 알아낼 수 없습니다

내 구성 요소의 메소드를 호출하고 싶습니다 사용자가 스크롤 할 때 그러나 sidenav 컨테이너를 사용할 때 더 이상 스크롤 이벤트가 발생하지 않습니다.

대신에 <mat-sidenav-content cdkscrollable></mat-sidenav-content> 요소가 추가되며 여기에 스크롤 막대가 있습니다.이벤트 리스너를 직접 액세스 할 수없는 경우이 구성 요소에서 스크롤이 발생할 때 어떻게 감지 할 수 있습니까?

아이디어가 있으십니까?

+1

나는 이것을 알고 싶습니다! – Willwsharp

답변

0

내 CSS 파일을 보여 주시겠습니까? 나는 또한 동일한 문제를 경험했다. 그러나 다음의 CSS가 mat-sidenav-container에 적용 되었기 때문에.

height: 100vh; 
0

예 : "Sidenav with a FAB"을 사용해야합니다.

<mat-sidenav-container class="example-sidenav-fab-container"> 
    <mat-sidenav #sidenav mode="side" opened="true"> 
    ... 
    </mat-sidenav> 
    <div class="example-scrolling-content" (scroll)="handleScroll($event)"> 
    ... content ... 
    </div> 
</mat-sidenav-container> 

을이 당신의 CSS를해야한다 :

DIV로 스크롤 컨텐츠를 넣어

.example-scrolling-content { 
    overflow: auto; 
    height: 100%; 
} 
0

이 오히려 태그를 삽입 자동으로 각도 것보다도, 당신의 HTML에서 side-nav-content 태그를 포함한다. 그런 다음 리스너를 추가 할 수 있습니다.

<mat-sidenav-container> 
    <mat-sidenav> 
    </mat-sidenav> 
    <mat-sidenav-content (scroll)="myScrollHandler($event)"> 
    </mat-sidenav-content> 
</mat-sidenav-container> 
관련 문제