Angular Material编译报错：'mat-cell'不是已知元素的问题求助

1. 检查Angular Material版本对应的标签写法 #

如果你的Angular Material是15及以上版本，mat-cell的写法已经变更——原来的独立<mat-cell>标签要改成在<td>上添加mat-cell属性，同时<mat-header-cell>要改成<th mat-header-cell>：

<!-- 旧版本（<15）写法 -->
<mat-cell *matCellDef="let item">{{item.value}}</mat-cell>

<!-- 新版本（15+）写法 -->
<td mat-cell *matCellDef="let item">{{item.value}}</td>

2. 确认模块导入的正确位置 #

别只在AppModule或者单个组件文件里导入MatTableModule——必须在你使用mat-cell的组件所属的NgModule的imports数组里添加MatTableModule。比如你的xx组件属于XxFeatureModule，那就要在XxFeatureModule的@NgModule里配置：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatTableModule } from '@angular/material/table';
import { XxComponent } from './xx.component';

@NgModule({
  declarations: [XxComponent],
  imports: [
    CommonModule,
    MatTableModule // 必须在这里导入
  ]
})
export class XxFeatureModule { }

3. 清理缓存后重新编译 #

缓存可能导致编译逻辑异常，执行以下命令重置后再构建：

ng cache clean
ng build

4. 排查CUSTOM_ELEMENTS_SCHEMA的干扰 #

如果你之前为了屏蔽错误加了CUSTOM_ELEMENTS_SCHEMA到模块的schemas里，这会让Angular忽略未知组件的校验，但如果mat-cell是Angular Material组件，这个配置会掩盖真正的导入问题，建议移除该Schema，确保模块导入正确后再编译。

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