Restricting uib-datepicker to just one year - angular-ui-bootstrap

Question

How do I fix the uib-datepicker to just one year. (say current year only).
I tried searching but all that I could find was to restrict calendar to year mode only. I tried setting year:2016 in datepicker-options but it didn't work.
Any suggestions ???

Answer 1

You can to use minDate and maxDate properties in the datepicker-options object as described in the docs.
The following code shows a datepicker limited to the current year:
angular.module('MyApp',['ui.bootstrap']).controller('AppCtrl', function($scope) {
$scope.open1 = function() {
$scope.popup1.opened = true;
};
$scope.dateOptions = {
minDate: moment().startOf('year').toDate(),
maxDate: moment().endOf('year').toDate()
};
$scope.format = 'dd-MMMM-yyyy';
$scope.popup1 = {
opened: false
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular-animate.min.js "></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular-touch.min.js "></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.2.0/ui-bootstrap-tpls.min.js"></script>
<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.css" rel="stylesheet"/>
<div ng-app="MyApp" ng-controller="AppCtrl">
<div class="row">
<div class="col-md-6">
<p class="input-group">
<input type="text" class="form-control" uib-datepicker-popup="{{format}}" ng-model="dt" is-open="popup1.opened" datepicker-options="dateOptions" show-button-bar="false" />
<span class="input-group-btn">
<button type="button" class="btn btn-default" ng-click="open1()"><i class="glyphicon glyphicon-calendar"></i></button>
</span>
</p>
</div>
</div>
</div>
Note that I used moment startOf, endOf and toDate to get the first and the last days of the current year as Date objects.