Material: SpeedDial: Using ng-cloak along with ng-hide causes issues.

[topherfangio]

@johnsheldon Creating a separate issue for your ng-cloak/ng-hide issue so we can track it better.

Also having this issue, ng-cloak fix worked for one of our speed dials. However, we have another speed dial which is hidden initially using ng-hide, then shown, and when used in conjunction with ng-cloak it causes the action items to be always expanded and invisible, but clickable.

http://codepen.io/johnsheldon/pen/JGGxNv

_Original comment available at https://github.com/angular/material/issues/6111#issuecomment-165197124_

[topherfangio]

Should consider watching for $md-resize broadcast.

[ed4becky]

I have a codepen at http://codepen.io/ed4becky/pen/eJwYvw that illustrates a similiar issue I have using a FAB in a dialog

[ThomasBurleson]

This issue is closed as part of our ‘Surge Focus on Material 2' efforts.
For details, see our forum posting @ http://bit.ly/1UhZyWs.

[pvillaverde]

Since it was closed without a solution, for anyone who runs into this problem, here's the workaround I found.
The inline styles for the md-fab-action-items were not being placed, so this CSS does their work:

md-fab-speed-dial.md-scale .md-fab-action-item {
        opacity         : 0;
        transform       : scale(0);
        transition-delay: 2ms;
        z-index         : 22;
}

md-fab-speed-dial.md-scale.md-is-open .md-fab-action-item {
        opacity         : 1;
        transform       : scale(1);
        transition-delay: 0;
        z-index         : 22;
}

[Splaktar]

@pvillaverde thank you for posting a workaround. I can help you through the process if you are interested in submitting a PR to fix this.

[pvillaverde]

Thanks but I think is more a patch than an actual solution for the problem. If I find a suitable solution I'll submit a PR!