2016-07-16 6 views
1

私はanglejsと角度のある素材をかなり新しくしています。なぜ私のmdボタンが私のブラウザ上に表示されないかもしれないのだろうかと思っていましたが、codepenで作業しました。角度素材md-buttonが正しくレンダリングされませんか?

<html ng-app='app'> 
<head> 
    <!-- Angular Material requires Angular.js Libraries --> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-animate.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-aria.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-messages.min.js"></script> 

<!-- Angular Material Library --> 
<script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0-rc2/angular-material.min.js"></script> 
<script src='app.js'></script> 
</head> 

<body ng-controller='MainCont'> 
<md-button class='md-primary'>hello</md-button> 
</body> 
</html> 

app.js:私は私のhtmlファイルでこれを入れ

var app = angular.module('app', ['ngMaterial']); 

app.controller('MainCont', function(){ 
}); 

モジュールとコントローラがすべてロードされますが、ブラウザでこのボタンは、次のように現れます:

button picture here

誰かが私にこの理由を説明することはできますか?本当にありがとう!

+0

うーん...あなたは何を期待しています? – developer033

+0

ここではデモのようなフラットなボタンが角度のある素材から来ると期待しています:https://material.angularjs.org/latest/demo/button – hello

+0

次に使用しているクラスを追加する必要があります。例: ' class = "md-raised md-primary md-button mdインクリップル"。 – developer033

答えて

2

あなただけAngularMaterialcssをインポートするのを忘れ:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.1.0-rc2/angular-material.min.css"> 
+0

ああ、それはあなたの助けてくれてありがとう、本当に間違っていた! – hello

+0

喜んでください:) – developer033

関連する問題