Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!

  1. MDB Home Page
  2. Support Main Page
  3. MDB Angular
Topic: Dynamical cards

IRoman pro asked 6 years ago

Hi, how to generate for example for online shop the cards or better overlay + text dynamical with *ngFor? Thx

Arkadiusz Idzikowski staff answered 6 years ago

Dear IRoman, Please provide an example html code and data on which you want to use ngFor. Regards, Arek

IRoman pro commented 6 years ago

Dear Arek, i think, it works like this:
Sample project image

{{ artwork.firstName }} {{ artwork.lastName }}

#abstact #modern

Thx, Igor

Arkadiusz Idzikowski staff answered 6 years ago

Dear IRoman, I can't spot any problems in your code, it should work fine. If you still have any problems with this component please let me know. Regards, Arek

IRoman pro answered 6 years ago

Sorry, it it works like this: <!--Grid column--> <div class="col-lg-3 col-md-3 mb-3" *ngFor="let artwork of featuredArtworks"> <!--Featured image--> <div class="view overlay rounded z-depth-1 waves-light" mdbWavesEffect> <img src="{{ artwork.fileAsDataUrl }}" class="img-fluid" alt="Sample project image"> <a> <div class="mask rgba-white-slight"></div> </a> </div> <!--Excerpt--> <mdb-card-body class="mt-3"> <h4> <strong>{{ artwork.firstName }} {{ artwork.lastName }}</strong> </h4></div> <!--Grid column-->
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

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

Resolved

Specification of the issue
  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 6.2.3
  • Device: desktop
  • Browser: chrome
  • OS: linux
  • Provided sample code: No
  • Provided link: No
Tags
card-dynamical
About author
IRoman
Pro User 105Support score
8Questions 6Answers 0Snippets