angular scroll to top – Angular Scroll to Top of Div Element Example

angular scroll to top – Scroll to the top of the page using angularjs with CSS Solution with Smooth Scrolling. first of all Add a New Component and then Set up the scroll-to-top button with some nice css styling.

angular scroll to top

4 Ways to Listen to Page Scrolling for Dynamic UI in Angular Scroll to top on Angular Router navigation.


import { Component, VERSION } from '@angular/core';
  selector: 'palainfo-v1',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
export class AppComponent  {
  name = 'Angular ' + VERSION.major;
  products : number[]=[];
    for(var i=0; i<100; i++){
  scrollToTop(el) {
    el.scrollTop = 0;


<h2>Angular Scroll to Top of Div Example -</h2>

<div #container class="container">
		<li *ngFor="let i of products">{{i}}</li>

<button (click)="container.scrollTop = 0">Scroll to Top</button>


  margin-bottom: 10px;
  width: 399px;
  background-color: #3d3d3d;
  height: 399px;
  overflow-y: scroll;

Don’t Miss : scroll-to-top implementation

Also Read This πŸ‘‰   how to call one controller from another controller in angularjs?

angular scroll to top


I hope you get an idea about angular scroll to top.
I would like to have feedback on my
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.