Topic: stepper component not working

INKOOM free asked 2 years ago


Trying to use stepper and I'm getting the following error on the browser console. Anything I'm doing wrong? below is the error:

ERROR TypeError: Cannot set properties of undefined (setting 'isActive') at MdbStepperComponent._setActiveStep (mdb-angular-ui-kit-stepper.mjs:352:9) at MdbStepperComponent.ngAfterContentInit (mdb-angular-ui-kit-stepper.mjs:371:14) at callHook (core.mjs:2526:1) at callHooks (core.mjs:2495:1) at executeInitAndCheckHooks (core.mjs:2446:1) at refreshView (core.mjs:9510:1) at refreshComponent (core.mjs:10640:1) at refreshChildComponents (core.mjs:9265:1) at refreshView (core.mjs:9519:1) at refreshEmbeddedViews (core.mjs:10594:1)

HTml Code is as follows:

<mdb-stepper [orientation]="'vertical'">
    <mdb-step *ngFor="let bdata of bulkCustomerData" [name]="bdata.formData.customerName" [editable]="false">

TS Code is as follows:

import { Component, OnInit } from '@angular/core';
import { BusinessService } from '../business.service';
import { BulkCustomerData } from '../models/data-models';

        selector: 'app-stepper', 
        templateUrl: './stepper.component.html', 
        styleUrls: ['./stepper.component.scss']

export class StepperComponent implements OnInit {

    bulkCustomerData: BulkCustomerData[] | undefined;

        private business: BusinessService 
    ) { 

    ngOnInit(): void {


getCustomerData(): void{ => {         this.bulkCustomerData = data; 


Arkadiusz Idzikowski staff commented 2 years ago

Could you please edit your post and provide the HTML/TS code that you used? It would help us to reproduce the problem on our end.

Arkadiusz Idzikowski staff commented 2 years ago

Thank you for the code. I think the problem may be caused by the async init of the mdb-step components. Can you try to add *ngIf directive to the mdb-stepper and display the component when the customer data is loaded?

Please insert min. 20 characters.


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



Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: MDB5 2.3.0
  • Device: Laptop
  • Browser: All
  • OS: Windows
  • Provided sample code: No
  • Provided link: No