InMemoryScrollingOptions

When set to 'enabled', scrolls to the anchor element when the URL has a fragment. Anchor scrolling is disabled by default.

Anchor scrolling does not happen on 'popstate'. Instead, we restore the position that we stored or scroll to the top.

Configures if the scroll position needs to be restored when navigating back.

• 'disabled'- (Default) Does nothing. Scroll position is maintained on navigation.
• 'top'- Sets the scroll position to x = 0, y = 0 on all navigation.
• 'enabled'- Restores the previous scroll position on backward navigation, else sets the position to the anchor if one is provided, or sets the scroll position to [0, 0] (forward navigation). This option will be the default in the future.

You can implement custom scroll restoration behavior by adapting the enabled behavior as in the following example.

class App {
  movieData = signal<MovieData | null>(null);
  private router = inject(Router);
  private viewportScroller = inject(ViewportScroller);
  private changeDetectorRef = inject(ChangeDetectorRef);

  constructor() {
   this.router.events.pipe(filter((event: Event): event is Scroll => event instanceof Scroll)
    ).subscribe(e => {
      fetch('http://example.com/movies.json').then(response => {
        this.movieData.set(response.json());

        if (e.position) {
          this.viewportScroller.scrollToPosition(e.position);
        }
      });
    });
  }
}