Angular material dialog disable scroll when refreshing the page-CodePudding

I'm using Angular 8 and Angular-material and I have a component contains a dialog that display at the opening, and when I close the dialog the scroll works fine, but once I refresh the page the scroll is disabled.

And I think the error would come from .cdk-global-scrollblock and I don't know for what reason this class added to my html tag:

.cdk-global-scrollblock {
    position: fixed;
    width: 100%;
    overflow-y: scroll;
}

i found this solution but not worked for me :

from :

  ngAfterViewInit() {
    this.dialog.open(DialogVideoComponent), {
      data: { radioValue: this.valueRadio },
    };
  }

To :

import { Overlay } from '@angular/cdk/overlay';

  ngAfterViewInit() {
    this.dialog.open(DialogVideoComponent), {
      data: { radioValue: this.valueRadio },
      scrollStrategy: this.overlay.scrollStrategies.noop()
    }; // added by AB
  }

Does someone knows How can i fix this issue ?

CodePudding user response：

I have already faced the same problem. Following this solution it worked for me.

Put this into your global css ( style.css ) :

.cdk-global-scrollblock{
  position: static !important;
  width: initial !important;
  overflow-y: scroll !important;
}