带有AdminLTED图标的md按钮

时间:2016-12-12 07:17:31

标签: javascript angularjs web-deployment

如何将AdminLTE中的图标添加到我的md按钮?

我有:

<md-button class="md-fab md-mini md-primary"></md-button>

1 个答案:

答案 0 :(得分:0)

你可以参考font-awesome css的链接,并且这样做,

<强> DEMO

angular.module('app', ['ngMaterial'])
  .controller('AppCtrl', function($scope) {

  });
<!DOCTYPE html>
<html ng-app="app">

<head>
  <meta charset="utf-8" />
  <title>AngularJS material-sidenav Plunker</title>

  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/angular-material/0.8.0/angular-material.css" />
  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />

  <script data-require="angular.js@1.3.13" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.js" data-semver="1.3.0-rc.5"></script>
  <script data-require="angular-aria@1.3.13" src="//code.angularjs.org/1.3.13/angular-aria.js" data-semver="1.3.0-rc.5"></script>
  <script data-require="angular-animate@1.3.13" src="//code.angularjs.org/1.3.13/angular-animate.js" data-semver="1.3.0-rc.5"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/angular-material/0.8.0/angular-material.js"></script>

  <script src="app.js"></script>
</head>


<body layout="horizontal" ng-controller="AppCtrl">
  <md-content>
    <div >
      <md-button class="md-fab md-mini md-primary" aria-label="Eat cake">
        <md-icon md-font-icon="fa fa-battery-three-quarters"></md-icon>
      </md-button>
    </div>
  </md-content>


</body>


</html>