Topic: MDB Carousel OnPush Problem
Dear Support,
Do you think you may be able to support "ChangeDetectionStrategy.OnPush" for the carousel component?
I see a mention of "ChangeDetectionStrategy" within "mdb-angular-ui-kit-carousel.metadata.json" but I am not sure how to enable this feature.
Here is a discussion on the topic from two years ago for reference. https://mdbootstrap.com/support/angular/mdb-carousel-problems/
Expected behavior The carousel should trigger "this.cdRef.markForCheck();" after an image is loaded.
Actual behavior Instead, images remain blank until a mouse over event triggers a re-draw.
Resources (screenshots, code snippets etc.)
@bidwej We added some fixes in v1.6.0, please let us know if you encounter any further problems.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- ForumUser: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: MDB5 1.3.0
- Device: Desktop
- Browser: Chrome
- OS: Windows 10
- Provided sample code: No
- Provided link: Yes
Arkadiusz Idzikowski staff commented 2 years ago
@bidwej In the specification of this issue you mentioned MDB5 1.3.0 version but the old support thread is from MDB4 Angular support. Do you use MDB4 Angular (angular-bootstrap-md or ng-ui-kit-pro-standard) or MDB5 Angular (mdb-angular-ui-kit)?.
Could you please provide more details about the code you used? Did you just add the carousel component inside a component with OnPush strategy or do you load/change something dynamically after the component is rendered?
bidwej free commented 2 years ago
Thank you for the follow-up. Yes. My carousel component is inside a component with "OnPush" strategy. I am using sample data that I set within "ngOnInit". Everything works when I am not using "OnPush". Images set using "src" only refresh when I mouse over the component. If the source code is available perhaps we could check to see 1) carousel is using the "OnPush" strategy and if so 2) whether "markForCheck" is being called within the carousel's "ngOnChanges" function. What do you think?
Arkadiusz Idzikowski staff commented 2 years ago
@bidwej Thank you for the detailed description. The solutions you suggested are probably correct, we will take a closer look at this component and make some additional tests to make sure this strategy is fully supported.
Could you also confirm which product/version do you use?