'md-card' 不是 material 中的已知元素 2

Question

我正在使用 angular 4 和 Material 2 开发 Web 应用程序。我遇到了这个错误

parse errors:
'md-card' is not a known element:
1. If 'md-card' is an Angular component, then verify that it is part of this module.
2. If 'md-card' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("<h2>Nothing to show</h2>
[ERROR ->]<md-card>Simple card</md-card>
"): ng:///AppAccessModule/SPLoginComponent.html@1:0
    at syntaxError

当我尝试在文件夹中嵌套两次的组件中使用 material 时

这些是我的结构：

  -----Components(folder)
  -------Auth(folder)
  --------Login(component1)
  --------Signup(component2)

但如果我下次这样：

  -------Auth(folder)
  --------Login(component 1)
  --------Signup(component2)

我没有任何问题，我应该怎么做才能解决这个问题？谢谢

Answer 1

您正在导入已在 beta-3 中弃用的 MaterialModule。要么导入所有你想单独使用的 Material 模块，即 MdCardModule 或者创建你自己的 BoomMaterialModule，在那里你导入和导出所有 Material 模块，你想在您的应用中使用。

错误：

import { MaterialModule,MdSelectModule } from '@angular/material';
         ^^^^^^^^^^^^^^

要么导入 MdCardModule

或创建 BoomMaterial模块：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import {
  MdButtonModule,
  MdButtonToggleModule,
  MdCardModule,
  ...
  MdExpansionModule
} from '@angular/material';
import 'hammerjs';

@NgModule({
  imports: [
    CommonModule,
    MdButtonModule,
    MdButtonToggleModule,
    MdCardModule,
    ...
    MdExpansionModule
  ],
  exports: [
    MdButtonModule,
    MdButtonToggleModule,
    MdCardModule,
    ...
    MdExpansionModule
  ]
})
export class BoomMaterialModule {
}

Answer 2

在您的 src/app/modules/app-access.module.ts 中导入 MdCardModule:

import { MdCardModule } from '@angular/material';

并将其添加到导入中：

imports: [ 
        ....
        MdCardModule, 
    ],

如果您正在使用 material 2 中的任何其他组件，请同时添加这些组件。

Answer 3

import { MatCardModule } from '@angular/material/card';

@NgModule({ ..
 imports: [..
MatCardModule]

Answer 4

如果您有 shared.module.ts 或者您只是单独导入模块，请确保在 Angular 的 BrowserModule[=14= 之后导入 Angular Material 模块]，因为导入顺序对 NgModules

很重要

'md-card' 不是 material 中的已知元素 2

'md-card' is not a known element in material 2

angular-material

angular-material2

angular