How to use angular material cdk stepper with a constructor

Question

Consider the following code:

import { Component } from '@angular/core';
import { CdkStepper } from '@angular/cdk/stepper';

@Component({
  selector: 'stepper-form',
  templateUrl: './stepper-form.component.html',
  styleUrls: ['./stepper-form.component.scss'],
  providers: [{ provide: CdkStepper, useExisting: StepperFormComponent }]
})
export class StepperFormComponent extends CdkStepper {
    constructor(){
        super();
    }
}

After doing some research I found out that I need to use the super() function. When I use it in my case , see cpde above, I get an error:

Expected 2-4 arguments, but got 0.

Which are this 2-4 arguments that I need to make the constructor work in this case?

user_13769284 · Answer

Just add:

constructor(
    dir: Directionality,
    changeDetectorRef: ChangeDetectorRef,
  ) {
    super(dir, changeDetectorRef);
  }

user_14332696 · Answer

https://github.com/angular/components/blob/master/src/cdk/stepper/stepper.ts

I assume Karolina looked up the constructor, line 330.

Which means the required imports are:

import {Directionality} from '@angular/cdk/bidi';

import {ChangeDetectorRef} from '@angular/core';

How to use angular material cdk stepper with a constructor

2 Answers