I'm build a web app with Angular 11 and Material, and it seems like Material's <button> is confliting with something.
I definitely didn't create a component called button so I can only assume it's conflicting with some other module. Here are my modules:
AppModule:
@NgModule({
declarations: [AppComponent, LoginComponent, PacienteComponent, AgendaComponent, FinanceiroComponent],
imports: [
BrowserModule,
AppRoutingModule,
BrowserAnimationsModule,
SharedModule,
FormsModule,
HttpClientModule,
],
providers: [LoginService],
bootstrap: [AppComponent],
})
export class AppModule {}
SharedModule:
@NgModule({
declarations: [
NavBarComponent,
UserLoginComponent,
ModalComponent,
SideMenuComponent,
],
exports: [NavBarComponent, MaterialModule],
imports: [
CommonModule,
MaterialModule
],
})
export class SharedModule {}
MaterialModule:
@NgModule({
imports: [
MatCardModule,
MatInputModule,
MatButtonModule,
MatProgressSpinnerModule,
MatCheckboxModule,
MatDialogModule,
MatMenuModule,
MatSidenavModule,
MatListModule,
MatToolbarModule,
MatIconModule,
],
exports: [
MatCardModule,
MatInputModule,
MatButtonModule,
MatProgressSpinnerModule,
MatCheckboxModule,
MatDialogModule,
MatMenuModule,
MatSidenavModule,
MatListModule,
MatToolbarModule,
MatIconModule,
],
})
export class MaterialModule {}
I only made sure to add all the modules I'm using because I'm pretty sure I'm messing something up here. Commenting out the MatButtonModule on the last modules file makes everything work again, but I kinda need that in.
Thanks!
