Angular 4：以编程方式滚动到页面顶部

Question

Does anyone know how to use Angular 4 and programmatically scroll the page to the top? My usescase is that I have a search page, and the input is at the top, and links to the other search results pages are at the bottom. When the user clicks a link (2,3,4...) I would like the page to populate with the new results (functionality is complete) and then scroll to the top of the page to show the results (this functionality is not complete).

I've see that this is possible with JQuery ( Scroll to top of page ) but I was wondering if there was a way to stay in the Angular 4 stack.

Any help is greatly appreciated.

Answer 1

Just use the native JavaScript window.scrollTo method -- passing in 0,0 will scroll the page to the top left instantly.

window.scrollTo(xCoord, yCoord);

Parameters

• xCoord is the pixel along the horizontal axis.
• yCoord is the pixel along the vertical axis.

Answer 2

You don't need additional library to do this. A standard HTML tag will be sufficient by using below syntax

<div id="place">
   Something.....
</div>

<a target="#place">Click Here .....!</a>