No provider for MatStepper

Bug, feature request, or proposal:

I wanted to use the MatStepper, so according to the documentation, here is what i’ve done

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

//Lots of interesting imports;

import { MatDialogModule, MAT_DIALOG_DEFAULT_OPTIONS, MatDialogRef } from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatStepperModule} from '@angular/material/stepper';

import { AddCapteurDialog } from './dialogs/addCapteur/addCapteur.component';

const ANGULAR_MATERIAL_IMPORTED_LIST = [
  //Several module import
  MatDialogModule,
  MatFormFieldModule,
  MatInputModule,
  MatStepperModule
]

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule,
    ...ANGULAR_MATERIAL_IMPORTED_LIST
  ],
  declarations: [MapviewComponent, AddNodeDialog, ConfirmDialog, AddCapteurDialog],
  entryComponents: [
     // Here comes my dialogs
    AddCapteurDialog,
  ],
  providers: [
    {
      provide: MatDialogRef,
      useValue: {
        close: (dialogResult: any) => { }
      }
    },
    {
      provide: MAT_DIALOG_DEFAULT_OPTIONS,
      useValue: {hasBackdrop: true}
    }
  ],
  exports : [MapviewComponent],
  bootstrap: [MapviewComponent]
})
export class MapviewModule { }

import { Component, OnInit } from '@angular/core';
import { FormBuilder, Validators, FormGroup } from '@angular/forms';
import { MatDialogRef } from '@angular/material/dialog';

@Component({
  selector: 'app-addCapteur',
  templateUrl: './addCapteur.component.html',
  styleUrls: ['./addCapteur.component.scss']
})
export class AddCapteurDialog implements OnInit {
  general:FormGroup
  constructor(public dialogref: MatDialogRef<AddCapteurDialog> ,private fb:FormBuilder) { }

  ngOnInit() {
    this.general = this.fb.group({
      name: ['', Validators.required],
      description : ['', Validators.required]
    });
  }

}

<h1 mat-dialog-title>
  {{title}}
</h1>
<mat-dialog-content>
    <mat-horizontal-stepper [linear]=true #stepper>
    <mat-step label="Step 1" [stepControl]="general" [editable]=true>
      <form [formGroup]="general">
        <ng-template matStepLabel>Commençons par les bases...</ng-template>
        <mat-form-field>
          <mat-label>Nom du capteur</mat-label>
          <input matInput [(ngModel)]="name" formControlName="name" required>
          <mat-hint>Identifions le capteur...</mat-hint>
        </mat-form-field>
        <mat-form-field>
          <mat-label>Description</mat-label>
          <input matInput [(ngModel)]="description" formControlName="description" required>
          <mat-hint>Que fait ce capteur ?</mat-hint>
        </mat-form-field>
        <div>
          <button mat-button matStepperNext>Next</button>
        </div>
      </form>
    </mat-step>
  </mat-horizontal-stepper>
</mat-dialog-content>
<mat-dialog-actions>
  <button mat-button mat-dialog-close color="warn" (click)="dialogRef.close()">Annuler</button>
  <button mat-button matStepperNext color="primary" (click)="submit()">Ajouter le capteur</button>
</mat-dialog-actions>

Please unederstand that i don’t show you the MapViewComponent, because the only beahvior youhave to understand is that it open the Dialog, and this work well

What is the expected behavior?

Make this component work

What is the current behavior?

I have this error : Error: StaticInjectorError(AppModule)[CdkStepper -> MatStepper]: core.js:1034 StaticInjectorError(Platform: core)[CdkStepper -> MatStepper]: NullInjectorError: No provider for MatStepper! at NullInjector.push…/node_modules/@angular/core/fesm5/core.js.NullInjector.get (d:\repositories\hweb_client\node_modules@angular\core\fesm5\core.js:1034:1) at resolveToken (d:\repositories\hweb_client\node_modules@angular\core\fesm5\core.js:1271:1) at tryResolveToken (d:\repositories\hweb_client\node_modules@angular\core\fesm5\core.js:1216:1) at StaticInjector.push…/node_modules/@angular/core/fesm5/core.js.StaticInjector.get (d:\repositories\hweb_client\node_modules@angular\core\fesm5\core.js:1113:1) at resolveToken (d:\repositories\hweb_client\node_modules@angular\core\fesm5\core.js:1271:1) at tryResolveToken (d:\repositories\hweb_client\node_modules@angular\core\fesm5\core.js:1216:1) at StaticInjector.push…/node_modules/@angular/core/fesm5/core.js.StaticInjector.get (d:\repositories\hweb_client\node_modules@angular\core\fesm5\core.js:1113:1) at resolveNgModuleDep (d:\repositories\hweb_client\node_modules@angular\core\fesm5\core.js:8161:1) at NgModuleRef_.push…/node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (d:\repositories\hweb_client\node_modules@angular\core\fesm5\core.js:8849:1) at resolveNgModuleDep (d:\repositories\hweb_client\node_modules@angular\core\fesm5\core.js:8161:1)

What are the steps to reproduce?

https://stackblitz.com/edit/matstepper-no-providers

This is the best i was able to do for the stackblitz. If someone is able to debug it to make able to reproduce perfectly my behavior, it would be good

What is the use-case or motivation for changing an existing behavior?

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 6

Is there anything else we should know?