Stepper (selectionChange) vs (selectionChanged) and [selectedIndex]

Bug, feature request, or proposal:

    <mat-horizontal-stepper [linear]="false" #stepper 
        [selectedIndex]="this.selectedIndex" 
        (selectionChange)="selectionChange($event)">
      <mat-step [completed]="false" label="First">
        <button mat-button (click)="goto(1)">Next</button>
      </mat-step>
      <mat-step [completed]="false" label="Second">
        <button mat-button (click)="goto(0)">Previous (cancelled)</button>
      </mat-step>
    </mat-horizontal-stepper>

In the stepper control the (selectionChange) event cannot be used together with [selectedIndex], because changing the [selectedIndex] also triggers (selectionChange), so there is no way of cancelling the selection programatically, or implement other logic ‘before’ the change is executed.

Expected it to work as a standard html select control where:

• when changing the .selectedIndex the (change) event doesn’t get automatically triggered
• the (change) event is triggered ‘before’ the change is finished, so it can be cancelled with event.preventDefault()

What is the expected behaviour?

• The current event should be renamed (selectionChanged) = ‘after’ the step has changed.
• Emit a new event (selectionChange) = ‘before’ the step has changed, with option to cancel the action, which doesn’t get automatically triggered when selectedIndex changes.

What is the current behavior?

selectionChange = ‘after’ the step has changed, naming is confusing, gets triggered automatically with [selectedIndex]

What are the steps to reproduce?

1. Select step 2
2. Press Previous button (the action is cancelled programatically) - ok
3. Press step 1 header (step 1 is still selected, the action cannot be cancelled, selectedIndex remains on step 2)

StackBlitz: https://stackblitz.com/edit/angular-material2-issue-9lskal

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

Be able to programatically enable/disable certain steps

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

Material 5.1.0

Is there anything else we should know?

[CarlosBustos1]

Is there any progress on the event ‘beforeSelectionChanged’ ? It would be very usefull

[ghost]

Any solution for before selection change? I am having same requirement