Как поставить проверку в столбце динамического отображения

Question

У меня есть <mat-select> с ngFor, который отображает список строк из таблицы.Мне нужно поставить проверку в типе столбца, чтобы я мог выбрать только 1 ключ, а затем пользователь не должен иметь возможность выбрать ключ в раскрывающемся списке типов.

// Code for html(Angular 7)
<!-- Column for Type-->
<ng-container matColumnDef="type">Type
<mat-header-cell *matHeaderCellDef mat-sort-header>Type</mat-header-cell>
<mat-cell *matCellDef="let element">
  <mat-select placeholder="Select Type" [(ngModel)]="element.type" (selectionChange)="checkTypeValidation(element,element.type)">
    <mat-option *ngFor="let type of typeColumn" [value]="type">
      {{ type }} 
      <div *ngIf = "element.type === "></div>
    </mat-option>
  </mat-select>
</mat-cell>
</ng-container>

Это код, который отображаеттип строки.Это mat-select с 6 вариантами.Тем не менее, на данный момент нет проверки.Вы можете выбрать каждую строку как ключ, время, сегмент.

Я хочу поставить проверку, что только одна строка может иметь тип ключ:

// Code for Typescript
  typeColumn = [
    'None',
    'Time',
    'Segment',
    'Key',
    'Input',
    'Quantile'
  ];

Этот код машинописного текста дает вам возможностьвыбрать опцию в раскрывающемся списке для столбца Тип.Я должен иметь возможность выбрать только одну строку в качестве ключа.

Answer 1

Я установил опцию как отключенную при каждом выборе и включил ее снова при изменении:

<mat-select placeholder="Type" (selectionChange)="changed($event)">

  changed(event){
    if(event.value.type == 'Key'){
       //when there was a value previously, allow it again
       if(this.previous[event.source.id] != undefined){
         this.typeColumn[this.previous[event.source.id]].allowed = true;
       }
       this.previous[event.source.id] = event.value.index;
       //disable the selected option
       this.typeColumn[event.value.index].allowed = false;
    }
  }

См. Подробный код в демоверсии.

Я уверен, что вы можете построитьрешение из этого:

Полная демонстрация