Angular - кнопка прокрутки вверх - PullRequest
Новая
       30

Angular - кнопка прокрутки вверх

0 голосов
/ 26 января 2020

Я разработал галерею изображений. Есть ли способ прокрутки на странице, чтобы мне показалась кнопка, чтобы при нажатии на нее все сделанные прокрутки были вверху (начало страницы)?

Я уже тестировал некоторые случаи, которые нашел и до сих пор никто не работал :( кто-то может мне помочь?

БЛИЦ

код 

  <ul class="mdc-image-list my-image-list" style="padding-left: 10px;padding-right: 10px;">
    <li class="mdc-image-list__item" *ngFor="let product of Images; let  j = index;">
      <div class="mdc-image-list__image-aspect-container">
          <img [src]="product.image" class="mdc-image-list__image">
      </div>
    </li>
  </ul>

1 Ответ

1 голос
/ 26 января 2020

Используйте hostListener для прослушивания события прокрутки окна, затем используйте angular Сервис ViewPortScroller, который предоставляет метод scrollToPostion , который используется для прокрутки до указанной позиции.

Попробуйте это:

component.ts 

@HostListener('window:scroll', ['$event']) onScroll(event){
    this.pageYoffset = window.pageYOffset;
 }

constructor(private scroll: ViewportScroller) { }

scrollToTop(){
    this.scroll.scrollToPosition([0,0]);
}

Рабочий пример

...