如何在mat-select角度7中嵌套mat-option

Question

我有mat-select和mat-datepicker。在mat-select中有3个选项。当我单击3rd（Custom）选项时，它必须显示datepicker，而不会关闭mat-select面板。要实现这一点，有任何插件。

编辑：

      <mat-form-field>
        <mat-select [(value)]="selectedOption" (selectionChange)="onSelectChange($event.value,$event)" placeholder="Date Range">

          <mat-option [value]="'Last 24 hours'">Last 24 hours               
          </mat-option>
          <mat-option [value]="'Last 7 days'">Last 7 days
          </mat-option>           

          <mat-option [value]="'Custom'">Custom
            <mat-select>
              <mat-option>
                <mat-form-field>
                  <input matInput [matDatepicker]="picker1">
                  <mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
                  <mat-datepicker #picker1></mat-datepicker>
                </mat-form-field>
              </mat-option>
            </mat-select>



        </mat-select>
      </mat-form-field>

在“自定义”上单击时，将显示日期选择器选择。但是在选择自定义选项时，父级垫选择会关闭

Answer 1

您应该使用menu而不是select。

请参见this example。