<!doctype html>
<html ng-app="datepickerBasicUsage">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-aria.min.js"></script>
<script src="https://gitcdn.xyz/repo/angular/bower-material/v0.11.0/angular-material.js"></script>
<script src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/t-114/assets-cache.js"></script>
<link rel="stylesheet" href="https://gitcdn.xyz/repo/angular/bower-material/v0.11.0/angular-material.css">
<script src="app.js"></script>
</head>
<body>
<div ng-controller="AppCtrl" style='padding: 40px;'>
<md-content>
<h4>Standard date-picker</h4>
<md-datepicker ng-model="minDate" md-placeholder="Enter date"></md-datepicker>
<h4>Date-picker with min date set to first picker</h4>
<md-datepicker ng-model="myDate" placeholder="Enter date"
md-min-date="minDate"></md-datepicker>
</md-content>
</div>
</body>
</html>
angular.module('datepickerBasicUsage', ['ngMaterial'])
.controller('AppCtrl', function ($scope) {
$scope.myDate = new Date();
$scope.minDate = new Date(
$scope.myDate.getFullYear(),
$scope.myDate.getMonth() - 2,
$scope.myDate.getDate());
$scope.maxDate = new Date(
$scope.myDate.getFullYear(),
$scope.myDate.getMonth() + 2,
$scope.myDate.getDate());
});