angular - 防止 mat-option 选择 if 条件

Question

我想阻止选择 mat-option，因为单击它会打开一个对话框。仅当从对话框中选择某些内容时，才应选择我的选项。如果对话框中未选择任何内容，则不应更改 mat-option 之前的值。

<mat-select 
        [(ngModel)]="filter_defaultSelectedValue" 
        (change)="changeSelectedValue($event.value)">
   <mat-option *ngFor="let filter of filters" [value]="filter">
      <span *ngIf="filter.id != 'custom'; else content_dialog">
         {{filter.label | i18n}}
      </span>
      <ng-template #content_dialog>
         <dialog
            [filterParams] = "filter.value">
         </dialog>
      </ng-template>
   </mat-option>
</mat-select>

我的垫选择有以下选项:“昨天”、“今天”、“明天”、“自定义范围”。例如，当我单击“昨天”时，它只会被选中，但是当我单击“自定义范围”时，会打开一个带有日历的对话框。如果我从日历中选择一个日期，对话框将关闭，并且“自定义范围”选项也会被选中。当我关闭对话框而不从日历中选择任何内容时，“自定义范围”选项将再次被选择。我不希望发生此选择，因为我没有从日历中选择任何内容。我该如何调节这个？

mat-options

Answer 1

我已经通过更改代码中的 ngModel“filter_defaultSelectedValue”来设法调节这种特殊情况。 如果在对话框中未选择任何内容，则 ngModel 将设置为先前设置的值:

this.filter_defaultSelectedValue = this.lastSelection;

如果选择了对话框内的某些内容，则我让 mat-select 将“filter_defaultSelectedValue”更改为该选定值。