我试图用Angularjs材料样式的按钮。具体来说,我想将MD-Button与Class MD-RAIN一起使用。
但是,当我尝试这个按钮时,我的按钮看起来像常规文本,而不是MD键。我会做错什么?
这是我的index.html,我试图放置按钮。
<!doctype html>
<html>
<head>
<!--Angular scripts-->
<link href="./node_modules/angular-material/angular-material.css" rel="stylesheet" />
<script src="./node_modules/angular/angular.js" type="text/javascript" ></script>
<script src="./node_modules/angular-animate/angular-animate.js" type="text/javascript" ></script>
<script src="./node_modules/angular-aria/angular-aria.js" type="text/javascript" ></script>
<script src="./node_modules/angular-material/angular-material.js" type="text/javascript" ></script>
<script src="node_modules/angular-route/angular-route.js"></script>
<script src="node_modules/angular-resource/angular-resource.js"></script>
<script src="mainController.js"></script>
</head>
<body>
<md-button class="md-raised">Button</md-button>
</body>
没有出现的原因是因为您忘记了初始化应用程序!
// Initialize your app here and add `ngMaterial` dependency
angular.module('App', ['ngMaterial']);
<!-- Also add your ng-app directive -->
<html ng-app="App">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular-aria.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular-messages.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.4/angular-material.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.4/angular-material.min.css">
</head>
<body>
<md-button class="md-raised">Test</md-button>
</body>
</html>
我能够通过添加
来实现这一目标 <div class="md-button md-raised">
<p>Button</p>
</div>
而不是
<md-button class="md-raised">Button</md-button>
我不确定为什么会起作用,并且对任何反馈都将不胜感激。