Angular stepper not working

Topic: Angular stepper not working

Ahmed Khan free asked 4 years ago

Expected behavior

Hi i am i started working with material for bootstrap and wanted to test it out first so i created a stackblitz and tried to use the Angular stepper. but unfortuntely it doesnt work and keeps giving stepperform error even after all dependencies installed.

Actual behavior

Work without dependencies error.

Resources (screenshots, code snippets etc.)

https://stackblitz.com/edit/angular-mdb-stepper-example

Add comment

react123 premium answered 3 years ago

0 0 Best answer

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'.
If 'mdb-stepper' is an Angular component and it has 'vertical' input, then verify that it is part of this module.
If 'mdb-stepper' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
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 { }

Please insert min. 20 characters.

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'. If 'mdb-stepper' is an Angular component and it has 'vertical' input, then verify that it is part of this module. If 'mdb-stepper' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. 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 { }

Arkadiusz Idzikowski staff commented 3 years ago

I already answered here: https://mdbootstrap.com/support/angular/angular-stepper-not-working/

Add comment

Arkadiusz Idzikowski staff answered 4 years ago

1 0 Best answer

You included MDB Angular Free (angular-bootstrap-md) in the dependency list. This component is available only in the MDB Angular Pro version (ng-uikit-pro-standard).

Add comment

Write

Create snippet

FREE CONSULTATION

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

Status

Answered

Specification of the issue

ForumUser: Free
Premium support: No
Technology: MDB Angular
MDB Version: 6.2.6
Device: Stackblitz
Browser: Chrome
OS: windows
Provided sample code: No
Provided link: Yes

Ahmed Khan

5Support score
1Questions 0Answers 0Snippets