mdb is not a known element


Topic: mdb is not a known element

ahess asked 6 years ago

I have the MDB Angular Pro version in the app.module I have this

imports: [
BrowserModule,
MyRoutingModule,
AngularFontAwesomeModule,
MDBBootstrapModulesPro.forRoot()
],


However any mdb tag used in any lazy loaded module produce an error.
mdb-progress' is not a known element:
1. If 'mdb-progress' is an Angular component, then verify that it is part of this module.
2. If 'mdb-progress' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("[ERROR ->]<mdb-progress value="25" min="0" max="100" type="danger" aria-valuenow="25" aria-valuemin="0" aria-va"): ng:///folder/ThisComponent.html@0:0
'mdb-progress' is not a known element:

Does theMDBBootstrapModulesPro has to be declared in every lazy module?
Is there another less repetitive way?


Arkadiusz Idzikowski staff answered 6 years ago

Dear ahess,

You need to import our modules to the lazy modules, but it is possible to import only those you actually use.

MDB Modules list

Regards,

Arek


NahlaEssam answered 6 years ago

I have the same problem with mdb-file-upload, but I already added the MDBBootstrapModulesPro in the lazy module, any solution for this issue?


Arkadiusz Idzikowski staff commented 6 years ago

Mdb-file-upload is an external plugin and it's not part of MDBBootstrapModulesPro. Please add 'MdbFileUploadModule' import.


react123 premium answered 4 years ago

I am using MDB Angular Pro version facing issue in Stepper

I have faced below error

  • error NG8002: 0mCan't bind to 'vertical' since it isn't a known property of 'mdb-stepper'.
    1. If 'mdb-stepper' is an Angular component and it has 'vertical' input, then verify that it is part of this module.
    2. If 'mdb-stepper' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
    3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

Code :

import { MDBSpinningPreloader, MDBBootstrapModulesPro, ToastModule } from 'ng-uikit-pro-standard';

imports:

[ BrowserModule, BrowserAnimationsModule, AppRoutingModule, FormsModule, ReactiveFormsModule, HttpClientModule, ColorPickerModule, ToastModule.forRoot(), MDBBootstrapModulesPro.forRoot(), ],

providers:

[ MDBSpinningPreloader, { provide: HTTP_INTERCEPTORS, useClass: JwtInterceptor, multi: true }, { provide: HTTP_INTERCEPTORS, useClass: ErrorInterceptor, multi: true } ],

schemas: [ NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA ],

bootstrap: [AppComponent] }) export class AppModule { }


nihalSalih answered 2 years ago

It seems like you are still getting the same error message. If you have already imported the MDBBootstrapModule in your app.module.ts file and added it to the imports array, you can try adding CUSTOM_ELEMENTS_SCHEMA to the @NgModule.schemas of your component to suppress this message. You can do this by adding the following lines to your app.module.ts file:

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
@NgModule({
  schemas: [CUSTOM_ELEMENTS_SCHEMA]
)}

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 7.0.0
  • Device: mac
  • Browser: chrome
  • OS: IOS
  • Provided sample code: Yes
  • Provided link: No