diff --git a/src/material-examples/table-expandable-rows/table-expandable-rows-example.html b/src/material-examples/table-expandable-rows/table-expandable-rows-example.html
index bf38ae1cdfd..d3a22b11d54 100644
--- a/src/material-examples/table-expandable-rows/table-expandable-rows-example.html
+++ b/src/material-examples/table-expandable-rows/table-expandable-rows-example.html
@@ -29,7 +29,7 @@
   <tr mat-row *matRowDef="let element; columns: columnsToDisplay;"
       class="example-element-row"
       [class.example-expanded-row]="expandedElement === element"
-      (click)="expandedElement = element">
+      (click)="expandedElement = expandedElement === element ? null : element">
   </tr>
   <tr mat-row *matRowDef="let row; columns: ['expandedDetail']" class="example-detail-row"></tr>
 </table>
diff --git a/src/material-examples/table-expandable-rows/table-expandable-rows-example.ts b/src/material-examples/table-expandable-rows/table-expandable-rows-example.ts
index 9d2b3b81356..4fc2630afd4 100644
--- a/src/material-examples/table-expandable-rows/table-expandable-rows-example.ts
+++ b/src/material-examples/table-expandable-rows/table-expandable-rows-example.ts
@@ -19,7 +19,7 @@ import {animate, state, style, transition, trigger} from '@angular/animations';
 export class TableExpandableRowsExample {
   dataSource = ELEMENT_DATA;
   columnsToDisplay = ['name', 'weight', 'symbol', 'position'];
-  expandedElement: PeriodicElement;
+  expandedElement: PeriodicElement | null;
 }
 
 export interface PeriodicElement {