carousel.component.ts line: 145 -- error message


Topic: carousel.component.ts line: 145 -- error message

jespenhain pro premium asked 6 years ago

Actual behavior After Upgrading from 7.5.2 to 7.5.3 the following error message is displayed in console: Cannot read property 'classList' of undefined at DefaultDomRenderer2.push../node_modules/@angular/platform-browser/fesm5/platform-browser.js.DefaultDomRenderer2.addClass (platform-browser.js:1102) at BaseAnimationRenderer.push../node_modules/@angular/platform-browser/fesm5/animations.js.BaseAnimationRenderer.addClass (animations.js:239) at DebugRenderer2.push../node_modules/@angular/core/fesm5/core.js.DebugRenderer2.addClass (core.js:28546) at CarouselComponent.push../node_modules/ng-uikit-pro-standard/fesm5/ng-uikit-pro-standard.js.CarouselComponent.ngAfterViewInit (ng-uikit-pro-standard.js:1410)

i realized the code which cause this problem is: (carousel.component.ts line: 145)

if (this.isControls) {
  this.carouselIndicators = this.el.nativeElement.querySelectorAll('.carousel-indicators > li');
  if (this.carouselIndicators.length && this.activeSlideIndex) {
    this.renderer.addClass(this.carouselIndicators[this.activeSlideIndex], 'active');
  } else {
    this.renderer.addClass(this.carouselIndicators[0], 'active');
  }
}

Resources (screenshots, code snippets etc.) `

    <mdb-carousel-item *ngFor="let item of imagesBasic" class="carousel-inner">
        <div class="view w-100">
            <div class="carousel-items w-100 overlay zoom" (click)="openImageModal(item.caption)"
                 [ngStyle]="{'background-image': 'url(' + item.img + ')','background-position': 'center center','height': '200px'}">
            </div>
        </div>
    </mdb-carousel-item>`

Arkadiusz Idzikowski staff answered 6 years ago

Hello,

Thank you for reporting this problem, we will take care of that.

Do you load the carousel data asynchronously?


jespenhain pro premium commented 6 years ago

yep asynchronously


Arkadiusz Idzikowski staff commented 6 years ago

This problem will be fixed in the next version of MDB Angular.


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: Pro
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: 7.5.1
  • Device: Angular
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: No
Tags