title: Include Buttons and Paginator in the Material Table Footer
body: <p>I use Angular Material Table and I need a command button and the table's paginator in the table's footer row, something like this
  <a href="https://i.stack.imgur.com/VFR2Z.png" rel="noreferrer"><img src="https://i.stack.imgur.com/VFR2Z.png" alt="enter image description here"></a></p>
  
  <p>My code is like this actually </p>
  
  <pre class="lang-xml prettyprint-override"><code>&lt;div class="example-table-container mat-elevation-z8"&gt;
  
    &lt;table mat-table [dataSource]="dataSource" multiTemplateDataRows&gt;
      &lt;!-- DataSource's displayedColumns --&gt;
      &lt;ng-container matColumnDef="{{column}}" *ngFor="let column of displayedColumns"&gt;
        &lt;th mat-header-cell *matHeaderCellDef&gt; {{column}} &lt;/th&gt;
        &lt;td mat-cell *matCellDef="let element"&gt; {{element[column]}} &lt;/td&gt;
      &lt;/ng-container&gt;
  
  
      &lt;!-- Exporter column --&gt;
      &lt;ng-container matColumnDef="exporter"&gt;
        &lt;td mat-footer-cell *matFooterCellDef colspan="2"&gt;
          &lt;button class="btn btn-primary" (click)="exportCsv(dataSource)"&gt;
            &lt;i class="material-icons" title="Exporter en CSV"&gt;save_alt &lt;/i&gt;
          &lt;/button&gt;
        &lt;/td&gt;
      &lt;/ng-container&gt;
  
      &lt;!-- Paginator column --&gt;
      &lt;ng-container matColumnDef="paginator"&gt;
        &lt;td mat-footer-cell *matFooterCellDef colspan="3"&gt;
          &lt;mat-paginator [pageSizeOptions]="[5,10,20]" showFirstLastButtons&gt;&lt;/mat-paginator&gt;
        &lt;/td&gt;
      &lt;/ng-container&gt;
  
      &lt;tr mat-header-row *matHeaderRowDef="displayedColumns"&gt;&lt;/tr&gt;
      &lt;tr mat-row *matRowDef="let element; columns: displayedColumns;"&gt;&lt;/tr&gt;
  
      &lt;tr mat-footer-row *matFooterRowDef="['exporter', 'paginator']"&gt;&lt;/tr&gt;
  
    &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>As you can see, I moved the <code>&lt;mat-paginator&gt;</code> element inside a <code>td</code>... But this broke the paginator as it doesn't paginate the table anymore... (you see "0 of 0" and disable pagination buttons)... when I put it back outside the <code>table</code> element, the paginator returns to normal...</p>
  
  <p>How to correctly put the paginator inside the footer row?</p>