【问题标题】:mat-form-field' is not a known element in angularmat-form-field' 不是 angular 中的已知元素
【发布时间】:2020-06-01 10:08:53
【问题描述】:

我正在使用角度材料的输入,但出现此错误 ** src/app/modules/posts/posts.component.html:2:5 中的错误 - 错误 NG8001:'mat-form-field' 不是已知元素: 1. 如果 'mat-form-field' 是 Angular 组件,则验证它是否是该模块的一部分。 2. 如果“mat-form-field”是 Web 组件,则将“CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“@NgModule.schemas”以禁止显示此消息。

这是我的html代码

<form class="example-form">
    <mat-form-field class="example-full-width">
     Favorite food
      <input matInput >
    </mat-form-field>


  </form>

这是我的应用模块

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { DefaultModule } from './layouts/default/default.module';
import { MatTableModule } from '@angular/material/table';
import { HttpClientModule } from '@angular/common/http';
import {UserInfoService} from './services/user-info.service'
import {MatCardModule} from '@angular/material/card';
import {MatDialogModule} from '@angular/material/dialog';
import { PostsComponent } from './modules/posts/posts.component';
import {  MatFormFieldModule} from '@angular/material/form-field';
import {MatInputModule} from '@angular/material/input';

@NgModule({
  declarations: [
    AppComponent,



  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    DefaultModule,
    MatTableModule,
    HttpClientModule,
    MatCardModule,
    MatDialogModule,
    MatFormFieldModule,
    MatInputModule
  ],
  exports: [

    MatFormFieldModule,
    MatInputModule,

  ],
  providers: [UserInfoService],
  bootstrap: [AppComponent],
  entryComponents:[PostsComponent]
})
export class AppModule { }

我找不到合适的解决方案,你能帮帮我吗?

【问题讨论】:

  • 无论你的组件在哪里声明(模块),导入你的材料模块。
  • 您使用的是哪个版本的材料? postComponent 声明在哪个模块中

标签: angular angular-material


【解决方案1】:

FormsModule, ReactiveFormsModule, 添加到imports 部分。删除两个 exports 元素。

【讨论】:

  • 我应该从什么导入它们?
  • 导入 { FormsModule, ReactiveFormsModule } from '@angular/forms';
  • 也将 PostsComponent 添加到 declarations
  • 现在我得到这个错误 PostsComponent' is declared by more NgModule.
  • 你在哪里声明过?也发一下。
猜你喜欢
  • 2018-06-14
  • 1970-01-01
  • 1970-01-01
  • 2018-10-24
  • 2021-01-22
  • 2018-02-20
  • 2019-06-27
  • 1970-01-01
  • 2019-08-14
相关资源
最近更新 更多