0

Cuando intento utilizar cualquier elemento de angular material me aparece este error:

NG8001: 'mat-form-field' is not a known element:

  1. If 'mat-form-field' is an Angular component, then verify that it is part of this module.
  2. If 'mat-form-field' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

Todo mi proyecto está en el siguiente repositorio: Proyecto semáforo

1 respuesta 1

1

Hola revise tu repo y no estas importando Material al Proyecto, lo mas usual es crear un Modulo de Material y ese modulo importarlo en App.Module.

te dejo un app.module.ts & material.module.ts de ejemplo de como se ve con importaciones de componentes de Angular Material

import { BrowserModule } from '@angular/platform-browser';
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { FormGroup, FormControl, FormsModule, ReactiveFormsModule } from 
'@angular/forms';

 import { HttpModule } from '@angular/http';
 import { HttpClientModule } from '@angular/common/http';

 import {
    MatButtonModule,
    MatFormFieldModule,
    MatInputModule,
    MatRippleModule
} from '@angular/material';
import { BrowserAnimationsModule } from 
'@angular/platformbrowser/animations';

import { AppComponent } from './app.component';
import { YahooService } from './yahoo.service';
import { SearchComponent } from './search/search.component';

@NgModule({
  exports: [
     MatButtonModule,
     MatFormFieldModule,
     MatInputModule,
     MatRippleModule,
  ],
  declarations: [
    SearchComponent,
  ],
})

export class MaterialModule {};

App.module:

  @NgModule({
    declarations: [
        AppComponent
     ],
    imports: [
       BrowserModule,
       BrowserAnimationsModule,
       **MaterialModule**,
       FormsModule,
       HttpModule,
       HttpClientModule,
     ],
     providers: [
         YahooService,
     ],
     Bootstrap: [
        AppComponent,
     ],
     schemas: [
        **CUSTOM_ELEMENTS_SCHEMA**,
     ],
 })
 export class AppModule { }

Te recomiendo profundizar en teams de modularizacion, exports e Imports de Anguar. https://www.tutorialesprogramacionya.com/angularya/detalleconcepto.php?punto=14&codigo=14&inicio=0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.