Use with google icon fonts

[Frankistan]

Is it possible to use with Google Icon Fonts, as follows:
<i class="material-icons">menu</i>

in order to show for example, menu (hamburguer) icon?

[joeybronner]

Up.

[smartm0use]

Is it possible to use with Font-Awesome library?

[pcsantana]

You can create your own template and set it to "template-url".
For example, in your app.js you can define the templates:

• FAM

$templateCache.put('custom-fam-template.html', 
            '<ul class="mfb-component--{{position}} mfb-{{effect}}"' +
            '    data-mfb-toggle="{{togglingMethod}}" data-mfb-state="{{menuState}}">' +
            '  <li class="mfb-component__wrap">' +
            '    <a ng-click="clicked()" ng-mouseenter="hovered()" ng-mouseleave="hovered()"' +
            '       ng-attr-data-mfb-label="{{label}}" class="mfb-component__button--main">' +
            '       <i class="mfb-component__main-icon--resting material-icons" style="font-size: 24px">{{resting}}</i>' +
            '       <i class="mfb-component__main-icon--active material-icons" style="font-size: 24px">{{active}}</i>' +
            '    </a>' +
            '    <ul class="mfb-component__list" ng-transclude>' +
            '    </ul>' +
            '</li>' +
            '</ul>');

• FAB:

$templateCache.put('custom-fab-child-template.html', 
            '<li>' +
            '  <a data-mfb-label="{{label}}" class="mfb-component__button--child>' +
            '       <i class="mfb-component__child-icon material-icons" style="font-size: 24px">{{icon}}</i>' +
            '    </i>' +
            '  </a>' +
            '</li>');

and in HTML:

<nav mfb-menu position="br" template-url="custom-fam-template.html" effect="zoomin" active-icon="clear" resting-icon="more_vert" toggling-method="click">
  <mfb-button icon="favorite" label="Favorite" ng-click="vm.foo()" mfb-button-close template-url="custom-fab-child-template.html"></mfb-button>
</nav>

[rhclayto]

@pcsantana Good solution. There is one small typo:

' <a data-mfb-label="{{label}}" class="mfb-component__button--child>' +

should be

' <a data-mfb-label="{{label}}" class="mfb-component__button--child">' +

i.e., there is a missing double quotation mark.