I am using mat-stepper, I have different component for all the steps. How can I stop mat-stepper to move to the next page if api call fails

Question

After I click on the Next button, I want the stepper to not move to next step if api response gives any other response other than the success. I am using Stepper in the parent component and used child components for the other steps.

If form validations are invalid then I am able to stop the stepper using [completed] as shown below. Stepper HTML

<div class="row stepper-page">
    <mat-card class="p-1 stepper-card">
        <mat-card-content class="card-content">
            <mat-stepper class="pe-3 stepper-content">
                <mat-step class="stepper-steps"  [completed]="firstCompleted" [editable]="false">
                    <ng-template matStepLabel>Create Jio eSign Account</ng-template>
                    <app-create-account></app-create-account>
                </mat-step>
                <mat-step>
                    <ng-template matStepLabel>Verify Your Aadhaar</ng-template>
                    <app-verify-aadhaar></app-verify-aadhaar>
                </mat-step>
                <mat-step>
                    <ng-template matStepLabel>Record Video & Audio</ng-template>
                </mat-step>
                <mat-step>
                    <ng-template matStepLabel>Submit for Verification</ng-template>
                </mat-step>
            </mat-stepper>
        </mat-card-content>
    </mat-card>
</div>

Stepper TS

export class StepperComponent {

  @ViewChild(CreateAccountComponent) createAccount: CreateAccountComponent;
  firstCompleted = false;



  ngAfterViewInit() {
    this.firstCompleted = this.createAccount.completed;
  }

 
}

Create Account HTML

<mat-card class="create-account-page">

    <mat-card-header class="header-class">Create Account</mat-card-header>
    <mat-card-content class="row createaccount-form pt-3">

...
...
...

     <button class="btn btn-primary btn-lg generateOtp-btn" matStepperNext [disabled]="createAccountForm.invalid" (click)="createAccount()">Next</button>

Create Account TS

createAccount(){

   //api call 

}

I want that for only success response the matStepperNext moves to the next step.