web-dev-qa-db-fra.com

Angular 4 | window.scrollTo (); ne fonctionne pas correctement

Actuellement, j'essaie de faire défiler automatiquement jusqu'en haut de la page HTML pour laquelle j'utilise dans mon TypeScript.

 window.scrollTo(0 , 0);

et tout en essayant de faire défiler automatiquement vers le bas de la page HTML

 window.scrollTo( 0 , document.body.scrollHeight);
  • J'essaie de faire défiler le haut après une réponse HTTP.

Code 

 openPDFVievwer(data) {
  this.obj= JSON.parse(data._body);
  document.getElementById('spinner').style.display = 'none';
  window.scrollTo( 0 , 0);
}
  • lorsque j'essaie de faire défiler le bas après le rendu d'un autre composant.

Code 

searchData(data) {
    this.document = data;
    this.searchResultDiv = true; // where component will be rendered
    window.scrollTo( 0 , document.body.scrollHeight);
  }

mais, les deux semblent ne pas fonctionner. 

Y a-t-il quelque chose que je fais mal?

javascripthtmlhtml5angulartypescript
4
Abhishek Ekaanth

essayer en html

<div #list [scrollTop]="list.scrollHeight"></div>

Solution 2

Dans Component Define id in html id="scrollId"

const element = document.querySelector('#scrollId');
element.scrollIntoView();
5
Shailesh Ladumor

La solution ci-dessus ne fonctionnait pas pour moi, essayez ceci code: 

import { Router, NavigationEnd } from '@angular/router';
constructor(private router: Router)
ngOnInit()
   {
     this.router.events.subscribe((evt) => {
    if (!(evt instanceof NavigationEnd)) {
    return;
      }
  document.getElementsByTagName("app-website-nav")[0].scrollIntoView();
});
   }
1
aravind balaji