uib-datepickerをわずか1年間に制限する

Question

uib-datepickerをちょうど1年に修正する方法を教えてください。 （今年度のみ）。

検索を試みましたが、私が見つけたのは、カレンダーを年モードに限定することだけでした。 datepicker-optionsにyear:2016を設定しようとしましたが、動作しませんでした。

提案がありますか？

Answer 1

docsに記載されているdatepicker-optionsオブジェクトのminDateおよびmaxDateプロパティを使用できます。私は、現在の最初と最後の日を取得する瞬間startOf、endOfとtoDateを使用

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>

注：

次のコードは、現在の年に制限日付ピッカーを示していますyearをDateオブジェクトとして返します。