Angular-Shepherd Tour Guide не прокручивает при нажатии на следующую страницу

Question

Все работает нормально, кроме прокрутки, когда я нажимаю на следующий элемент, берет их, но не прокручивает вниз, чтобы увидеть цель, которую я должен прокрутить вниз.Я пробовал много способов, но я не смог исправить, пожалуйста, помогите мне решить эту проблему. Я прошел по этой ссылке https://www.npmjs.com/package/angular-shepherd, но без выбора.Если кто-нибудь может мне помочь, это было бы очень полезно для меня.

<h2 class="second-element">London</h2>

<p class="third-element">London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>

<div class="first-element">cool</div>

Я добавил это в свой код файла app.component.ts ..

import { ShepherdService } from 'angular-shepherd';


export class AppComponent implements AfterViewInit {
  constructor(private shepherdService: ShepherdService) { }

  ngAfterViewInit() {

    this.shepherdService.disableScroll = true;
    this.shepherdService.modal = true;
    this.shepherdService.confirmCancel = false;
    this.shepherdService.addSteps([
      {
        id: 'intro',
        options: {
          attachTo: '.first-element bottom',
          beforeShowPromise: function() {
            return new Promise(function(resolve) {
              setTimeout(function() {
                window.scrollTo(0, 0);
                resolve();
              }, 500);
            });
          },
          buttons: [
            {
              classes: 'shepherd-button-secondary',
              text: 'Exit',
              type: 'cancel'
            },
            {
              classes: 'shepherd-button-primary',
              text: 'Back',
              type: 'back'
            },
            {
              classes: 'shepherd-button-primary',
              text: 'Next',
              type: 'next'
            }
          ],
          classes: 'custom-class-name-1 custom-class-name-2',
          highlightClass: 'highlight',
          scrollTo: true,
          showCancelLink: true,
          title: 'Welcome to Rivet Labs',
          text: ['This will help you toggle sidebar menu'],
          when: {
            show: () => {
              console.log('show step');
            },
            hide: () => {
              console.log('hide step');
            }
          }
        }
      },
      {
      here is 2nd id goes here 
      },
      {
      here is 3rd id goes here
      }
}

Answer 1

Я решил свою проблему, просто нам нужно удалить функцию прокрутки со следующего идентификатора, чтобы получить элемент в положении по умолчанию.мы должны удалить это свойство // beforeShowPromise: function () {} // для следующего идентификатора.

     beforeShowPromise: function() {
        return new Promise(function(resolve) {
          setTimeout(function() {
            window.scrollTo(0, 0);
            resolve();
          }, 500);
        });
      },