scrollIntoView() угловой 7 не прокручивается
Я пытаюсь реализовать прокрутку от одного компонента к другому в моем приложении, но на данный момент он только "перепрыгивает" на компонент, а не прокручивает.
Я пробовал следующее:
export class HomeComponent implements OnInit {
scroll(el: HTMLElement) {
el.scrollIntoView({ block: 'start', behavior: 'smooth', inline: 'nearest' });
}
constructor() {
}
ngOnInit() {
}
}
Вот мой шаблон:
<section class="bg-full bg-home">
<div class="logo"></div>
<a (click)="scroll(testPortfolio)" href="#portfolio" id="scroll-to-section">
<img src="../../assets/arrow-scroll.svg" width="36">
</a>
</section>
<app-about></app-about>
<app-portfolio-slider #testPortfolio></app-portfolio-slider>
<app-contact></app-contact>
В качестве альтернативы я также пытался с использованием ViewChild()
, но это всегда возвращает undefined
как я полагаю, потому что <app-portfolio-slider>
еще не отображается
Что мне нужно сделать, чтобы прокрутка происходила плавно?
1 ответ
Решение
Так что мое предположение было неверным. Как упомянул @arbghl в комментариях, автору просто нужно было обернуть целевой элемент <div>
у которого есть scrollIntoView()
метод и использовать этот div в качестве целевого элемента. Надеюсь, это поможет.