var app = angular.module('app', ['ngBootstrap']);
app.controller('DatepickerDemoCtrl', function ($scope) {
$scope.formData = {};
$scope.resetRange = function() {
$scope.formData.inputDateRange = {startDate:moment(),endDate:moment()}
}
});
<!DOCTYPE html>
<html ng-app="app">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css" />
<link data-require="bootstrap-css@*" data-semver="3.0.0-rc1" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.min.css" />
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://github.com/dangrossman/bootstrap-daterangepicker/raw/master/daterangepicker.css"/>
<script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.11/angular.js" data-semver="1.3.11"></script>
<script src="http://momentjs.com/downloads/moment.js"></script>
<script src="https://rawgit.com/dangrossman/bootstrap-daterangepicker/v1.3.17/daterangepicker.js"></script>
<script src="https://rawgit.com/luisfarzati/ng-bs-daterangepicker/master/src/ng-bs-daterangepicker.js"></script>
<script src="app.js"></script>
</head>
<body>
<h3>Testing Luis Farzati ng-bs-daterangepicker Date Range picker</h3>
<form>
<div ng-controller="DatepickerDemoCtrl">
<br>
<label for="userInputDateRange" class="control-label"><span><i class="fa fa-lg fa-calendar"></i></span></label>
<input type="daterange" ng-model="formData.inputDateRange" ranges="ranges" id="userInputDateRange" size="21" name="inputDateRange">
<br>
Model Start Date{{ formData.inputDateRange.startDate }}
<br>
Model End Date {{ formData.inputDateRange.endDate }}
<br>
<button ng-click="resetRange()">reset</button>
</div>
</form>
</body>
</html>
/* Put your css in here */