FAB Speed Dial and Simple dropdown menu not working

Question

I've followed the demo as given in the angular material site. https://material.angularjs.org/latest/#/demo/material.components.menu

I'm facing a problem where the simple dropdown menus and speed dials are just static and not initalized.

Can't seem to figure out what I am missing.

<div layout="column">
  <md-content class="md-padding" layout="column">
    <div class="lock-size" layout="row" layout-align="center center">
      <md-fab-speed-dial md-open="false" md-direction="up"
                         ng-class="md-fling">
        <md-fab-trigger>
          <md-button aria-label="menu" class="md-fab md-warn">
            <i class="fa fa-car"></i>
          </md-button>
        </md-fab-trigger>
        <md-fab-actions>
          <md-button aria-label="twitter" class="md-fab md-raised md-mini">
            <i class="fa fa-car"></i>
          </md-button>
          <md-button aria-label="facebook" class="md-fab md-raised md-mini">
            <i class="fa fa-car"></i>
          </md-button>
          <md-button aria-label="Google hangout" class="md-fab md-raised md-mini">
            <i class="fa fa-car"></i>
          </md-button>
        </md-fab-actions>
      </md-fab-speed-dial>
    </div>
  </md-content>
</div>

Answer 1

I changed the ng-class attribute on the <md-fab-speed-dial> tag to simply class, and it works now. Have a look at this link from the Angular Material site.

In your case, you should have:

<md-fab-speed-dial md-open="false" md-direction="up" class="md-fling">