角材质-不工作/渲染没有特定的类

Angular Material - Not working/Rendering w/o specific class

本文关键字：工作      更新时间：2023-09-26

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

Issue - 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>

图片链接(我需要声誉)Issue图片

不知道你的javascript代码，我猜你只是忘记了在你的应用程序中导入ngMaterial模块，没有它的指令将无法完全渲染。

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

为什么它与类的工作是因为md-button指令不做任何事情除了创建一个按钮与类.md-button里面。

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

相关文章：