javascriptangularmodal-dialogsimplemodal

Angular, body add css overflow:hidden if modal is open and remove it if closed?

Is there any way to put the body in overflow:hidden when I open a modal? In this way I can scroll only the modal and not the body element.

Solution

  • I used this solution

    typescript file

    constructor() {
  const body = document.getElementsByTagName('body')[0];
  body.classList.add('modal-open');
}
ngOnDestroy() {
   const body = document.getElementsByTagName('body')[0];
   body.classList.remove('modal-open');
}

    css file

    .modal-open { overflow-y: hidden; }