Как выполнить операцию window.scrollTo в cdk / scrolling (настраиваемая полоса прокрутки)

Question

Я знаю, что мы делаем window.scrollTo (50,0) в полосе прокрутки по умолчанию. Я использую angular материал cdk/scrolling, чтобы создать скроллер области просмотра внутри главной страницы.

Но я не знаю, как сделать опции window.scrollTo в настроенном виде прокрутки. (то есть) если я нажму какую-нибудь кнопку, она должна переместиться.

Здесь у нас есть документация, чтобы сделать это, я новичок в angular, поэтому использование псевдонимов интерфейса / типа является новым для меня.

Вот документация https://material.angular.io/cdk/scrolling/api

Answer 1

Директива

cdkScrollable помогает выполнить это действие.

1. Добавьте директиву cdkScrollable в app.component.html или свой собственный шаблон

   <cdk-virtual-scroll-viewport cdkScrollable>...</cdk-virtual-scroll-viewport

2. Создайте переменную для просмотра компонента Чили в app.component.ts или в своем собственном классе

   @ViewChild(CdkScrollable) cdkScrollable: CdkScrollable;

3. В функции, используя метод scrollTo, мы можем достичь этого. Доступны свойства

   this.cdkScrollable.scrollTo({left: 3000});

   top, bottom, left, right.