mat-expansion-panel not support *ngFor in mat-accordion

Bug, feature request, or proposal:

without *ngFor, 2 expansion-panel will work correctly inside a mat-accordion.

<mat-accordion>

  <mat-expansion-panel>
    <mat-expansion-panel-header>
      This is the expansion 1 title
    </mat-expansion-panel-header>

    This the expansion 1 content

  </mat-expansion-panel>

  <mat-expansion-panel>
    <mat-expansion-panel-header>
      This is the expansion 2 title
    </mat-expansion-panel-header>

    This the expansion 2 content

  </mat-expansion-panel>

</mat-accordion>

But if I use *ngFor, the content will not open when I click.

<mat-accordion>
  <mat-expansion-panel *ngFor="let panel of panels">
    <mat-expansion-panel-header>
      {{panel.title}}
    </mat-expansion-panel-header>
    {{panel.content}}
  </mat-expansion-panel>

</mat-accordion>

What is the expected behavior?

with *ngFor, it should still work as expected.

What is the current behavior?

with *ngFor, the expansion panel will not open.

What are the steps to reproduce?

Providing a StackBlitz/Plunker (or similar) is the best way to get the team to see your issue.
Plunker starter (using on @master): https://goo.gl/DlHd6U
StackBlitz starter (using latest npm release): https://goo.gl/wwnhMV

The plunker template not working…

What is the use-case or motivation for changing an existing behavior?

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 5.0.0-beta7 material 2.0.0-beta.12 Typescript 2.4.2 Browsers Chrome

Is there anything else we should know?

Thanks.

[JiaLiPassion]

@julianobrasil , thank you very much, I use sideNav and it seems I used wrong css, it worked now.

https://stackblitz.com/edit/expansion-panel-axzbag?file=styles.scss

[julianobrasil]

Your code is working right: https://stackblitz.com/edit/expansion-panel

Try to modify the code in stackblitz to reproduce the problem.