Search code examples
angularangular-router

Make window scroll to new view being loaded through angular router

for example I have a navigation menu, when I click it the new view gets loaded under my hero banner, when this is clicked I'd like the window to automatically scroll to the new loaded view, and i'd like the scroll to be done over the course of a set time.

here's a picture for example When I click menu I'd like it to scroll to the starting of the menu's div, same for the second image. enter image description here

Solution

  • You can use a library as ng2-smooth-scroll to achieve it.

    <a routerLink="/yourlink"
  scrollTo="your-element"
  duration="800">
  Click me!
</a>
...
<router-outlet id="your-element"></router-outlet>