VSCode 无法识别 Angular Material 组件（突出显示为红色）答案

【问题标题】：Angular Material components not recognized by VSCode (highlighted be red color)VSCode 无法识别 Angular Material 组件（突出显示为红色）
【发布时间】：2018-08-07 08:48:17
【问题描述】：

我在开发 Angular v6 项目（基于 this starter）时使用 Visual Studio Code，其中包括 Angular Material 模块。

项目编译运行良好，但是在编辑器中，Angular Material组件无法识别：

我猜识别的问题是因为材料模块没有直接导入模块，而是导入了“共享”模块，它导入了材料，但也许我错过了一些东西。

任何帮助将不胜感激

【问题讨论】：

标签： angular visual-studio-code angular-material

【解决方案1】：

您是否在应用的主模块/材质模块中导入了MatIconModule？

material.module.ts

@NgModule({
  imports: [
    MatIconModule
    // ...
  ],
  exports: [
    MatIconModule
    // ...
  ]
})
export class MaterialModule { }

app.module.ts

import { MaterialModule } from './material.module';
// Other imports

@NgModule({
  imports: [
    MaterialModule
    // ...
  ]
  // ...
})
export class AppModule { }

或者（假设您没有材料模块）：

app.module.ts

import { MatIconModule } from '@angular/material/icon';
// Other imports

@NgModule({
  imports: [
    MatIconModule
    // ...
  ]
  // ...
})
export class AppModule { }

【讨论】：

【解决方案2】：

导入 JS 模块

import { MaterialIconsModule } from 'ionic2-material-icons';

在角度导入中导入

 @NgModule({
  declarations: [MyApp],
  imports: [
    MaterialIconsModule
  ],

有时 VSCode 需要重新启动才能识别此类更改。

【讨论】：

项目中包含的materialIconModule（虽然不是直接在这个模块中）