A few things surprised me upfront. At your module for your component you will need to loop in MatCardModule as an import from '@angular/material' to have the cards as described here and here. Also, the *ngFor for looping through a collection need not be on the card's <mat-card> tag which wraps the guts of the card while ultimately closing out with </mat-card> but instead it may be on a div wrapping the <mat-card> tag without screwing up the flexbox style layout of the cards floating side by side. Don't ask me how.
Addendum 9/11/2019: I was wrong about the flex magic. It turns out that I had a div wrapping the element where I had *ngFor with display:flex; and flex-flow:wrap; on it. You have to have something like this. It won't just work by itself. While I am talking, you may just directly style mat-card in CSS as you might div, section, or article.
No comments:
Post a Comment