Angular Scroll To Top

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.

Contents

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

src/app/app.component.ts

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

src/app/app.component.html

Angular Scroll to Top of Div Example - www.pakainfo.com


	
		{{i}}

src/app/app.component.css

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

Don't Miss : scroll-to-top implementation

angular scroll to top

scrollToTop(){
	window.scroll(0,0);
}

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

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