Nested menu items for parent shown with *ngIf are visible after click only

[Gribanov]

Bug, feature request, or proposal:

Bug. When menu item is shown via *ngIf and it has child menu this child menu becomes visible only after clicking on parent menu item. If parent menu item is "static" (i.e. is always in template) child menu becomes visible on hover.

What is the expected behavior?

Child menu becomes visible on hovering over parent

What is the current behavior?

Child menu becomes visible on clicking parent menu item

What are the steps to reproduce?

See
http://plnkr.co/edit/xsqusDiMhDHCdHrSbMOa?p=preview
"Show menu" button has menu with two items that have child menu. One item ("Always enabled child items") is always enabled, its child menu is shown on mouseover. Another menu item ("Triggered child items") is controlled by "Toggle" button. If it's visible you need to click on it to reveal its child menu

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

    "@angular/common": "4.3.2",
    "@angular/compiler": "4.3.2",
    "@angular/core": "4.3.2",
    "@angular/flex-layout": "2.0.0-beta.8",
    "@angular/forms": "4.3.2",
    "@angular/http": "4.3.2",
    "@angular/material": "^2.0.0-beta.10"

Browsers: latest stable Chrome, Firefox, IE11

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}