CODEWITHSUNDEEP
angular-dartangular-dart-routing
rkunboxed
rkunboxed

Reputation: 178

Why doesn't RouterLink take you to the top of the new page but a regular HTML link does when both compile to the same HTML?

I have <router-outlet [routes]="Routes.all"></router-outlet> set in my app component. I have a page with links at the bottom of the page. If a user clicks a link I want them to be taken to the top of the new page.

If I use RouterLink the current scroll position is retained so the user lands in the middle of the new page.

<a [routerLink]="RoutePaths.featurePage.toUrl()">...</a>

If I use a regular HTML link, I get the behavior I want, the user lands at the top of the new page.

<a href="/feature-page">...</a>

What I really don't get is how they can respond differently yet compile to the exact same HTML code.

<a class="_ngcontent-zbb-0" href="/feature-page">...</a>

What am I missing here?

I understand regular non-Dart Angular has something called scrollPositionRestoration but it doesn't seem to exist for AngularDart.

Upvotes: 0

Views: 783

Answers (1)

Night King
Night King

Reputation: 455

The answer is really a hack to return the scroll position by utilizing the

window.scrollTo(x,y) function.

This issue was raised in here in regular angular Equivalent to autoscroll=true: automatic scroll to top when route changes

remmeber to import dart:html

Upvotes: 0

Related Questions