Row Expand

To enable Row expansion functionality use expandable property of m-table component and declare template with mTemplate property as 'expansion'

<m-table [value]=countries expandable="true">

         <ng-template let-row let-index="rowIndex" mTemplate="expansion">
             {{index}} - {{row}}
          </ng-template>

</m-table>

Expanding and Collapsing row triggers onRowExpand and onRowCollapse events respectively.

<m-table [value]=countries
         expandable="true" (onRowExpand)="rowExpanded($event)" (onRowCollapse)="rowCollapse($event)">
</m-table>

Expand Mode

By default row expansion has multiple expansion mode, to change this use expandMultiple property of m-table component.

<m-table [value]=countries
         expandable="true" expandMultiple="true">
</m-table>

Table Component m-table Properties