升级至Angular 6/Material 6后为何出现'mat-input-container未知元素'错误？

嘿，这事儿我碰到过！Angular Material 6对表单容器组件做了关键更新——mat-input-container已经被正式弃用，取而代之的是通用的mat-form-field组件，这就是你的代码在升级后失效的核心原因。

在旧版本里，mat-input-container仅用于包裹输入类控件，但从Material 6开始，所有表单控件（包括mat-select、mat-input等）都需要统一放在mat-form-field容器中。

修改后的代码如下：

<mat-form-field>
  <mat-select placeholder="Sort By" formControlName="sortBy">
    <mat-option *ngFor="let sortByObject of sortByList" [value]="sortByObject.value">
      {{ sortByObject.label }}
    </mat-option>
  </mat-select>
</mat-form-field>

你已经导入的MatInputModule、MatSelectModule、MatFormFieldModule都是正确的，只需要把mat-input-container替换成mat-form-field就能恢复正常功能啦。

内容的提问来源于stack exchange，提问作者nsk