Skip to content

Commit 497cf81

Browse files
committed
fix(sidenav): implicit content element being registered twice with scroll dispatcher
When the consumer doesn't provide a `mat-sidenav-content`, we create one implicitly for them. The implicit content element has a `cdkScrollable` on it, which means that the it'll be registered on the `ScrollDispatcher` as a `CdkScrollable`, however since `MatSidenavContent` also extends `CdkScrollable`, it'll be registered again as a `MatSidenavContent`. These change remove the extra `cdkScrollable` from the view in order to avoid the issue. These changes also provide the sidenav content as a `CdkScrollable` for DI purposes.
1 parent d22f48c commit 497cf81

File tree

3 files changed

+10
-2
lines changed

3 files changed

+10
-2
lines changed

src/lib/sidenav/drawer.ts

+4
Original file line numberDiff line numberDiff line change
@@ -85,6 +85,10 @@ export function MAT_DRAWER_DEFAULT_AUTOSIZE_FACTORY(): boolean {
8585
},
8686
changeDetection: ChangeDetectionStrategy.OnPush,
8787
encapsulation: ViewEncapsulation.None,
88+
providers: [{
89+
provide: CdkScrollable,
90+
useExisting: MatDrawerContent,
91+
}]
8892
})
8993
export class MatDrawerContent extends CdkScrollable implements AfterContentInit {
9094
constructor(

src/lib/sidenav/sidenav-container.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,6 @@
55

66
<ng-content select="mat-sidenav-content">
77
</ng-content>
8-
<mat-sidenav-content *ngIf="!_content" cdkScrollable>
8+
<mat-sidenav-content *ngIf="!_content">
99
<ng-content></ng-content>
1010
</mat-sidenav-content>

src/lib/sidenav/sidenav.ts

+5-1
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ import {
2323
import {MatDrawer, MatDrawerContainer, MatDrawerContent} from './drawer';
2424
import {matDrawerAnimations} from './drawer-animations';
2525
import {coerceBooleanProperty, coerceNumberProperty} from '@angular/cdk/coercion';
26-
import {ScrollDispatcher} from '@angular/cdk/scrolling';
26+
import {ScrollDispatcher, CdkScrollable} from '@angular/cdk/scrolling';
2727

2828

2929
@Component({
@@ -37,6 +37,10 @@ import {ScrollDispatcher} from '@angular/cdk/scrolling';
3737
},
3838
changeDetection: ChangeDetectionStrategy.OnPush,
3939
encapsulation: ViewEncapsulation.None,
40+
providers: [{
41+
provide: CdkScrollable,
42+
useExisting: MatSidenavContent,
43+
}]
4044
})
4145
export class MatSidenavContent extends MatDrawerContent {
4246
constructor(

0 commit comments

Comments
 (0)