How to make a horizontal stepper scroll to the left or scroll into view?

userwavi1 0
Viewed 20

Below is my attached code and screenshot i've tried using scrollintoview,scrollleft,scrollto with no luck ng-stepper

  <mat-horizontal-stepper linear [selectedIndex]="6">
      <mat-step label="Initial"    [completed]="false"></mat-step>
      <mat-step label="Pemegang"   [completed]="false" [editable]="false"></mat-step>
      <mat-step label="Tertanggung"[completed]="false" [editable]="false"></mat-step>
      <mat-step label="Pembayar Premi"[completed]="false" [editable]="false"></mat-step>
      <mat-step label="Data Usulan"[completed]="false" [editable]="false"></mat-step>
      <mat-step label="Investasi"  [completed]="false" [editable]="false"></mat-step>
      <mat-step label="Kuisioner"  [completed]="false" [editable]="false"></mat-step>
      <mat-step label="Konfirmasi" [completed]="false" [editable]="false"></mat-step>       
  </mat-horizontal-stepper>
stepper scroll css angular html
1 Answers

solved this for me

onclick = () => {
     const elem=document.getElementById("cdk-step-label-0-5")
     elem?.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'center' })
    };
userwavi10
Related