title: Angular Material v6 Mat-Footer - "Cannot read property 'template' of undefined"
body: <p>I'm trying to implement a footer row into a mat-table component after recently upgrading to angular 6 for this purpose, but after adding both the mat-footer-cell and mat-footer-row elements in the table, I get the following error:</p>
  
  <blockquote>
    <p>ERROR TypeError: Cannot read property 'template' of undefined
    at MatFooterRowDef.push../node_modules/@angular/cdk/esm5/table.es5.js.CdkFooterRowDef.extractCellTemplate (vendor.js:17400)</p>
  </blockquote>
  
  <p>The table still appears on the page, but with no data, no footer row, and a T symbol where to the right of each column heading.</p>
  
  <p>HTML:</p>
  
  <pre><code>  &lt;ng-container matColumnDef="total"&gt;
  
      &lt;mat-header-cell *matHeaderCellDef mat-sort-header style="width: 15%; flex: none"&gt;Total&lt;/mat-header-cell&gt;
  
      &lt;mat-cell *matCellDef="let item" style="width: 15%; flex: none"&gt;{{item.total | currency: 'GBP'}}&lt;/mat-cell&gt;
  
      &lt;td mat-footer-cell *matFooterCellDef&gt;100&lt;/td&gt;
  
    &lt;/ng-container&gt;
  
    &lt;mat-header-row *matHeaderRowDef="tableColumns"&gt;&lt;/mat-header-row&gt;
  
    &lt;mat-row *matRowDef="let row; columns: tableColumns" (click)="editItem(row)"&gt;&lt;/mat-row&gt;
  
    &lt;tr mat-footer-row *matFooterRowDef="tableColumns"&gt;&lt;/tr&gt;
  
  &lt;/mat-table&gt;
  </code></pre>