角度材料不起作用

时间:2016-08-11 17:35:19

标签: angularjs angular-material

我正在尝试实施一个角度材料应用程序,参考“入门”教程。

<link href="../node_modules/angular-material/angular-material.css" rel="stylesheet" />

脚本

<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>
    // Include the dependency upon ngMaterial - important !!
    angular.module('starterApp', ['ngMaterial']);
</script>

我添加了一个工具栏&amp;按钮使用<md-toolbar>&amp; <md-button>如下所述:

 <md-toolbar class="md-menu-toolbar">
    <div class="md-toolbar-tools">
        Toolbar
    </div>
</md-toolbar>
<md-button class="md-fab" aria-label="FAB">
    button
</md-button>

但我看到的不是棱角材料设计click here.

我错过了什么吗?

1 个答案:

答案 0 :(得分:0)

以下是您的问题的答案......

<html lang="en">
<head>
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.css">
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-animate.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-aria.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-messages.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.js"></script>
    <script type="text/javascript">
        angular.module('starterApp', ['ngMaterial']);
    </script>
</head>
<body ng-app="starterApp" ng-cloak>
<md-toolbar class="md-menu-toolbar">
    <div class="md-toolbar-tools">
        Toolbar
    </div>
</md-toolbar>
<md-button class="md-fab" aria-label="FAB">
    button
</md-button>
</body>
</html>