lemoncodes lemoncodes - 3 months ago 50
Javascript Question

Angular Material FAB Dial button

I've been trying Angular Material and using the FAB Speed Dial, using their demo, I played around but I can't see to have it running properly, I modified the HTML source markup and just left the js side unmodified. Here is what I modded on the source code

<md-fab-speed-dial md-open="false" md-direction="down" ng-class="md-fling">
<md-fab-trigger>
<md-button aria-label="menu" class="md-fab md-warn">
<md-icon md-svg-src="img/icons/menu.svg"></md-icon>
</md-button>
</md-fab-trigger>
<some other code...>


As you can see, compared to the DEMO source code they wrote,
md-open
,
md-direction
and
ng-class
was modified by me and just change it to the actual value. But the result is this

enter image description here

It won't hide the buttons neither does that button menu function work. Here is the code pen link from their Demos FAB Speed Dial Angular Material

Answer

for ng-class you set "down" but in their example there are possible two values:

  • 'md-fling'
  • 'md-scale'

so it should be for instance:

ng-class="'md-fling'"
Comments