AngularJS素材を使用してmd-raisedとしてmd-buttonを表示する方法

私のボタンをAngularJS素材でスタイリングしています。具体的には、クラスmd-raisedでmd-buttonを使用したいと思います。AngularJS素材を使用してmd-raisedとしてmd-buttonを表示する方法

私がこのボタンを試すと、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>

出典

2017-06-25 JohnDoe

あなたのアプリを初期化するのを忘れてしまったために表示されなかった理由は、アプリを初期化するのを忘れたためだ

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

出典

2017-06-25 06:59:17 Edric

ああ、もちろん！私は今、かなり馬鹿だと感じる。ご協力いただきありがとうございます！ – JohnDoe

私はこれはしかし動作し、任意のフィードバックは次のようになり、なぜ私はよく分からない

<div class="md-button md-raised"> 
     <p>Button</p> 
    </div>

代わりの

<md-button class="md-raised">Button</md-button>

を追加することによって、これを達成することができました大いに感謝します。

出典

2017-06-25 06:52:28 JohnDoe

！ – Edric

AngularJS素材を使用してmd-raisedとしてmd-buttonを表示する方法

答えて

関連する問題