Как получить индекс выбранной опции вне выбора в Angular?

Вы можете просто установить переменную [(ngModel)] и использовать ее для получения индекса

<mat-select placeholder = "Type" [(ngModel)] = "selected" formControlName = "type" name = "type" id = "name">
    <mat-option>None</mat-option>
    <mat-option *ngFor = "let t of types" [value] = "t">
      {{t}} <-- it is enum -->
    </mat-option>
</mat-select>

а затем в компоненте используйте

this.index = this.types.findIndex(item => item === selected);

Как предлагает этот пример документации по материалам Angular, вы можете привязать к [(value)] двумя способами:

<mat-form-field>
  <mat-select [(value)] = "selected">
    <mat-option>None</mat-option>
    <mat-option *ngFor = "let t of types; let i = index" [value] = "i">{{t}}</mat-option>
  </mat-select>
</mat-form-field>

<p>You selected: {{selected}}</p>

selected будет собственностью вашего класса.

Вот Рабочий StackBlitz от Angular Team для справки.

Согласно ответу Саджитарана, использование ngModel вместе с реактивной формой не рекомендуется, а также устарело. Вместо этого следите за изменениями элемента управления формы, найдите индекс и сохраните его в переменной для дальнейшего использования. Вот пример:

myForm: FormGroup;

idx: number;
foods = ['Steak', 'pizza-1'];

constructor(private fb: FormBuilder) { }

ngOnInit() {
  this.myForm = this.fb.group({
    mySelect: ['']
  });

  this.myForm.get('mySelect').valueChanges.subscribe((value) => {
    this.idx = this.foods.findIndex(val => val === value);
    console.info(this.idx)
  });
}