Angular Material - 不工作/渲染没有特定的类答案

【问题标题】：Angular Material - Not working/Rendering w/o specific classAngular Material - 不工作/渲染没有特定的类
【发布时间】：2015-07-15 20:59:21
【问题描述】：

所以我正在学习 Angular Material 并决定从头开始尝试，而不是从入门演示中复制代码。

问题 - 除非我在类中指定元素名称，否则不会显示 Angular Material。例如

            <md-button class="md-button md-raised loginBtnBackgroundColor toolbarFontColor">
                Login
            </md-button>

            <md-button class="md-raised registerBtnBackgroundColor toolbarFontColor">
                Register
            </md-button>

我将添加 HTML 代码以查看是否有人看到此问题。我一直在尝试几个小时，却看不到为什么它与入门应用程序相比不起作用。

<!DOCTYPE html>
<html>

<head lang="en">
    <meta charset="UTF-8">
    <title>Scoutlit - AngularMaterial</title>

    <!-- Anglar Material CSS -->
    <!--<link rel="stylesheets" type="text/css" href="bower_components/angular-material/angular-material.min.css">-->
    <link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.css">

    <!-- Main CSS -->
    <link rel="stylesheet" type="text/css" href="assets/css/main.css">

</head>

<body ng-app="angularMaterialDemo">
    <div layout="row">
        <md-toolbar class="md-toolbar-tools md-whiteframe-z2">
            <!-- this isn't need i believe since we can add the class to the md toolbar <div class="md-toolbar-tools">-->
            <img src="http://scoutlit.com/images/logo-small.png" border="0" class="">
            <!-- fill up the space between left and right area -->
            <span flex></span>
            <md-button class="md-button md-raised loginBtnBackgroundColor toolbarFontColor">
                Login
            </md-button>
            <md-button class="md-raised registerBtnBackgroundColor toolbarFontColor">
                Register
            </md-button>
            <!--</div>-->
        </md-toolbar>
    </div>
    <!--
    <div ng-view>


    </div>
    -->

</body>

<!-- Angular JS -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.js"></script>


<!-- My JS -->

<script src="assets/js/controllers/homepageController.js"></script>
<script src="assets/js/app.js"></script>



</html>

下面的图片链接（我需要声誉） Image of Issue

【问题讨论】：

你能创建一个可重现问题的工作 plunkr

标签： javascript angularjs angular-material

【解决方案1】：

在不知道您的 javascript 代码的情况下，我猜您只是忘记在您的应用程序中导入 ngMaterial 模块，否则指令将无法完全呈现。

angular.module('angularMaterialDemo', ['ngMaterial']);

为什么它与类一起工作是因为md-button 指令除了创建一个包含.md-button 类的按钮之外没有做任何事情。

【讨论】：

感谢您的回复！原来我有一个 $injector:modulerr 错误，它不允许 Angular 发挥它的魔力。错误是由于我指向的 CDN 也是最新的不使用 ng-Route 的 angularjs。
@Staeff 你是明星！谢谢。

【解决方案2】：

原来我有一个 $injector:modulerr 错误，它不允许 Angular 发挥它的魔力。错误是由于我指向的 CDN 也是最新的不使用 ng-Route 的 angularjs。

【讨论】：