Angular Материал: MatStepper в дочернем компоненте не работает

Question

Я пытаюсь перейти к дочернему компоненту после проверки формы. Я могу использовать matStepperNext для следующего шага, но он работает без проверки. Я пытаюсь использовать следующее, но stepper приходит undefined

Дочерний компонент:

@ViewChild('stepper', { static: true }) stepper: MatStepper;

...some code

if (formValid){
  this.stepper.next()
}

Родительский компонент HTML:

          <mat-horizontal-stepper #stepper [linear]="true">
            <mat-step [stepControl]="form1">
              <ng-template matStepLabel>Form 1</ng-template>
              <app-child1></app-child1>
            </mat-step>
            <mat-step [stepControl]="form2">
              <ng-template matStepLabel>Form 1</ng-template>
              <app-child2></app-child2>
            </mat-step>
            <mat-step [stepControl]="form3">
              <ng-template matStepLabel>Form 3</ng-template>
              <app-child3></app-child3>
            </mat-step>
          </mat-horizontal-stepper>