2016-08-11 3 views
2

Я пытаюсь реализовать приложение углового материала в соответствии с учебником «Начало работы».Угловой материал не работает

стиль

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

Я добавил панель инструментов & кнопку с помощью <md-toolbar> & <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.

Я не пропустить что-нибудь?

+2

вы включили угловую библиотеку в страницу? – MarkoCen

+0

Да, я добавил угловую библиотеку –

+0

, и появились ли у вас ошибки в консоли? – MarkoCen

ответ

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>