title: Angular material matcard dynamic inside material grid
body: <p>I want to display matCard dynamically using for loop with 3 columns and 3 rows totally 9 matcards using angular material .how to do that inside matGrid list. how to dipaly it dynamically inside grid and matcards . Can anyone help please</p>
  <pre><code>&lt;mat-grid-list cols=&quot;3&quot; rowHeight=&quot;1:0.7&quot; &gt;  &lt;mat-grid-tile *ngFor =&quot;let tile of Tiles&quot;&gt;
      &lt;mat-card class=&quot;card&quot;&gt;
        &lt;mat-card-header&gt;
          &lt;mat-icon class=&quot;front&quot;&gt;home&lt;/mat-icon&gt;
          &lt;br /&gt;
          &lt;mat-card-title&gt;Pop&lt;/mat-card-title&gt;
          &lt;mat-icon class=&quot;corner&quot;&gt;more_vert&lt;/mat-icon&gt;
        &lt;/mat-card-header&gt;
        &lt;mat-divider&gt;&lt;/mat-divider&gt;
        &lt;mat-card-content class=&quot;content&quot;&gt;
          &lt;span class=&quot;num&quot;&gt;7896&lt;/span&gt;
          &lt;br /&gt;
          Actual
          &lt;br /&gt;
        &lt;/mat-card-content&gt;
  
        &lt;mat-divider&gt;&lt;/mat-divider&gt;
  
        &lt;mat-card-footer&gt;
          &lt;span&gt;data:&lt;/span&gt;
          &lt;span style=&quot;padding-left: 40;&quot;&gt; 550,000&lt;/span&gt;
          &lt;br /&gt;
          &lt;span&gt; Accuracy: -6.5&lt;/span&gt;
        &lt;/mat-card-footer&gt;
      &lt;/mat-card&gt;
    &lt;/mat-grid-tile&gt;
  
  &lt;/mat-grid-list&gt;
  </code></pre>