issue with pro Carousel component


Topic: issue with pro Carousel component

maverik1815 asked 6 years ago

Expected behavior carousel should not show error in in console Actual behavior

Console. error in carousel.component ERROR TypeError: Cannot read property 'classList' of undefined at DefaultDomRenderer2.push../node_modules/@angular/platform-browser/fesm5/platform-browser.js.DefaultDomRenderer2.addClass (vendor.js:82268) at BaseAnimationRenderer.push../node_modules/@angular/platform-browser/fesm5/animations.js.BaseAnimationRenderer.addClass (vendor.js:80875) at DebugRenderer2.push../node_modules/@angular/core/fesm5/core.js.DebugRenderer2.addClass (vendor.js:71172) at CarouselComponent.push../node_modules/ng-uikit-pro-standard/fesm5/ng-uikit-pro-standard.js.CarouselComponent.ngAfterViewInit (vendor.js:93051) at callProviderLifecycles (vendor.js:69268) at callElementProvidersLifecycles (vendor.js:69242) at callLifecycleHooksChildrenFirst (vendor.js:69232) at checkAndUpdateView (vendor.js:70168) at callViewAction (vendor.js:70400) at execComponentViewsAction (vendor.js:70342)

Resources (screenshots, code snippets etc.)


Damian Gemza staff answered 6 years ago

Dear maverik1815,

Could you please provide me with the code which causes you that problem? I'm unable to reproduce it on my end.

Best Regards,

Damian


rory answered 6 years ago

I'm getting the same issue with Angular carousel on MDB free. The sample code works fine from the MDB page (https://mdbootstrap.com/docs/angular/advanced/carousel/) but when I try and use an *ngFor to display actual data, I get the error. My TS is simply returning an array called sites[] which has objects with properties url, text, subtext, so a very basic data source.

The carousel is still working but I don't like having the console filled with paragraphs of errors.

I've included my code template and the full error below.

thanks for any help

Rory

<mdb-carousel class="carousel slide carousel-fade" [animation]="'fade'">
  <mdb-carousel-item *ngFor="let img of sites">
    <div class="view w-100">
      <img class="d-block w-100" src="{{ img.url }}">
      <div class="mask rgba-black-light waves-light" mdbWavesEffect></div>
    </div>
    <div class="carousel-caption">
        <h3 class="h3-responsive">{{ img.text }}</h3>
        <p>{{ img.subtext }}</p>
      </div>
  </mdb-carousel-item>
</mdb-carousel>

ERROR TypeError: Cannot read property 'classList' of undefined at DefaultDomRenderer2.push../node_modules/@angular/platform-browser/fesm5/platform-browser.js.DefaultDomRenderer2.addClass (platform-browser.js:1111) 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:24320) at CarouselComponent.push../node_modules/angular-bootstrap-md/fesm5/angular-bootstrap-md.js.CarouselComponent.ngAfterViewInit (angular-bootstrap-md.js:1721) at callProviderLifecycles (core.js:22416) at callElementProvidersLifecycles (core.js:22390) at callLifecycleHooksChildrenFirst (core.js:22380) at checkAndUpdateView (core.js:23316) at callViewAction (core.js:23548) at execComponentViewsAction (core.js:23490)


Damian Gemza staff answered 6 years ago

Dear Rory,

As I said before, I'm not able to reproduce this problem.

Is there a possibility to send me the whole app where that console error appears? Please send it to me via email, here's my address: d.gemza@mdbootstrap.com

Best Regards,

Damian


Tyn commented 6 years ago

Hello! I am having the same problem. The problem occurs when you do ng-for in mdb-carousel-item. Any clues of how to fix that?


Arkadiusz Idzikowski staff commented 6 years ago

We found the cause of this problem and it should be fixed in next version of MDB Angular.


carlosalviz commented 6 years ago

Hi! Just 1 question.

This issue got solved? I used to worked fine with it, inside the 7.5.1 version. But now with the new one (7.5.3) it started to fail. *same error showed in this ticket.


Arkadiusz Idzikowski staff commented 6 years ago

It looks like this problem wasn't resolve completely and still occurs in some cases. We are already working on it and there shouldn't be any problems with that in 7.5.4. Sorry for the inconvenience.


carlosalviz commented 6 years ago

Tks for the replay! I'll wait for the next version.


FREE CONSULTATION

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

Status

Closed

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 7.4.3
  • Device: PC
  • Browser: Chrome
  • OS: UBUNTU
  • Provided sample code: No
  • Provided link: No