Description
Bug, feature request, or proposal:
Feature request
What is the expected behavior?
The Sidenav automatically wraps the content
in a mat-sidenav-content
.
Also the CdkScrollable
-directive is added to this element and I would like to get a reference to it.
What is the current behavior?
It does not seem to be possible to access the CdkScrollable
instance.
As it is created automatically it does not seem to be accessible using @ViewChild
or @ContentChild
.
What are the steps to reproduce?
Create a simple Sidenav and check the resulting HTML in the DevTools:
Written code
<mat-sidenav-container>
<mat-sidenav>Sidenav content</mat-sidenav>
<div>Main content</div>
</mat-sidenav-container>
Resulting HTML
<mat-sidenav-container>
<div class="mat-drawer-backdrop"></div>
<div tabindex="-1" class="cdk-visually-hidden cdk-focus-trap-anchor"></div>
<mat-sidenav>Sidenav content</mat-sidenav>
<mat-sidenav-content cdkScrollable>
<div>Main content</div>
</mat-sidenav-content>
</mat-sidenav-container>
Now try to access the cdkScrollable
-Instance of the mat-sidenav-content
.
What is the use-case or motivation for changing an existing behavior?
The content of the sindenav is scrollable by default. In my case I want to hide some elements, when the user scrolls down.
My work-around is to wrap the content in another scrollable-container and make the mat-sidenav-container
not-scrollable (height = parent height).