Search code examples
bootstrap-4bootstrap-modalangular7

ngb modal scroll to top of page

I'm using ngb modal in my Angular 7 application, and while the modal is opened I need to scroll to the top of the modal when I do a specific action.

For example, there is a button in the bottom of the modal, once I click this button, I need the page to scroll to the top of the modal,

I tried to use 

window.scrollTop = 0;

and

document.getElementsByClassName('custom-modal').scrollTop = 0;

and

document.getElementsByClassName('custom-modal').scrollTo({
  top: 0
})

but these solutions are not working.

Solution

  • There are multiple ways.. I used normal anchor: <a name="top"></a> and <a class="btn btn-outline-dark" href="#top">scroll to top</a>

    See working example: https://stackblitz.com/edit/angular-nf8k31?file=app%2Fmodal-component.ts

    Disadvantage

    URL gets changed in address bar

    Another way is to create a link (or any other focusable object) and setFocus to it.