<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
<link rel="stylesheet" href="//rawgit.com/MSakamaki/AdventCalendar2014/master/scripts/bower_components/angular-material/angular-material.css">
<script src="//rawgit.com/MSakamaki/AdventCalendar2014/master/scripts/bower_components/angular/angular.js"></script>
<script src="//rawgit.com/MSakamaki/AdventCalendar2014/master/scripts/bower_components/angular-aria/angular-aria.js"></script>
<script src="//rawgit.com/MSakamaki/AdventCalendar2014/master/scripts/bower_components/angular-animate/angular-animate.js"></script>
<script src="//rawgit.com/MSakamaki/AdventCalendar2014/master/scripts/bower_components/hammerjs/hammer.js"></script>
<script src="//rawgit.com/MSakamaki/AdventCalendar2014/master/scripts/bower_components/angular-material/angular-material.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="myapp">
<div ng-controller="myctrl as md">
<md-content>
<!--チェックボックスサンプル -->
<section layout="column" layout-sm="column" layout-align="center center">
<md-checkbox ng-model="md.cb1" aria-label="Checkbox 1">
Checkbox 1: {{ md.cb1 }}</md-checkbox>
</section>
<!--ボタンのサンプル -->
<section layout="column" layout-sm="column" layout-align="center center">
<md-button class="md-raised">Button</md-button>
<md-button class="md-raised md-primary">Primary</md-button>
<md-button ng-disabled="true" class="md-raised md-primary">Disabled</md-button>
<md-button class="md-raised md-warn">Warn</md-button>
<div class="label">raised</div>
</section>
<!--スライダーのサンプル -->
<section layout="column" layout-sm="column" layout-align="center">
<h3>Rating: {{rating}}/5</h3>
<md-slider md-discrete ng-model="rating" step="1" min="1" max="5" aria-label="rating">
</md-slider>
</section>
</md-content>
<script>
angular.module( 'myapp', [ 'ngMaterial' ] )
.controller("myctrl", function(){
this.cb1 = true;
});
</script>
</div>
</body>
</html>
// Code goes here
angular.module( 'myapp', [ 'ngMaterial' ] )
.controller("YourController", function(){
});
/* Styles go here */