NG8001: 'mat-label' is not a known element:-CodePudding

Even though I have already imported these 3 modules ( FormsModule, MatFormFieldModule, BrowserModule,) The error is appearing.

import { CUSTOM_ELEMENTS_SCHEMA, NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
import {MatFormField, MatFormFieldModule, MatLabel} from '@angular/material/form-field';

@NgModule({
  declarations: [
    AppComponent,
    DialogComponent,
 
   
  ],
  imports: [
    MatFormFieldModule,
    FormsModule,
    MatLabel
  ],
  providers: [],
  bootstrap: [AppComponent],
  schemas:[NO_ERRORS_SCHEMA]

})
export class AppModule { }

Error:

Error: src/app/dialog/dialog.component.html:36:9 - error NG8001: 'mat-label' is not a known element: 1. If 'mat-label' is an Angular component, then verify that it is part of this module. 2. If 'mat-label' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. 36 Comment

CodePudding user response：

With this module you also be require 'MatInputModule' to be imported.

you can check below sample module for reference:

// common-widgets.module.ts
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';

 @NgModule({
  imports: [
  MatFormFieldModule,
  MatInputModule
  ]
  })
  export class CommonWidgetsModule { }

CodePudding user response：

Could you please try like below example:

 import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
    import { FormsModule } from '@angular/forms';
    import { BrowserModule } from '@angular/platform-browser';
    import { MatFormFieldModule } from '@angular/material/form-field';
    
    @NgModule({
      declarations: [
        AppComponent,
        DialogComponent
      ],
      imports: [
        BrowserModule,
        FormsModule,
        MatFormFieldModule
      ],
      providers: [],
      bootstrap: [AppComponent],
      schemas: [CUSTOM_ELEMENTS_SCHEMA]
    })
    export class AppModule { }