如何使用Ui-bootstrap Datepicker限制未来月份

Question

以下代码是angularjs代码。我使用了ui-bootstrap datepicker.So我如何限制未来的月份。

$ scope.format =＆＃34; MMMM-yyyy＆＃34 ;;

    $scope.dateOptions = {
        minMode: 'month',
        maxdate : new Date()
    };


    $scope.open2 = function () {
        $scope.popup2.opened = true;
    };

    $scope.popup2 = {
        opened: false
    };

HTML code：

input type="text"  class="form-control" ng-model="dt" ng-change="dateChanged()" uib-datepicker-popup="{{format}}"   is-open="popup2.opened"
                datepicker-options="dateOptions"  datepicker-mode="'month'" ng-required="true"
                id="datepicker" show-button-bar="false" readonly required />
                <span class="input-group-btn">
                <button type="button" class="btn btn-default" ng-click="open2()">
                <i class="glyphicon glyphicon-calendar" id="calendar"></i>
                </button>
                </span>

Answer 1

要在AngularJS UI引导程序日期选择器中禁用将来的日期选择，我们需要将模型值设置为max-date属性作为今天的日期。

＆＃13;

＆＃13;

angular.module('myApp', ['ngAnimate', 'ui.bootstrap']);
angular.module('myApp').controller('myCntrl', function($scope) {
  $scope.today = function() {
    $scope.dt = new Date();
  };
  $scope.dateformat = "MM/dd/yyyy";
  $scope.today();
  $scope.showcalendar = function($event) {
    $scope.showdp = true;
  };
  $scope.showdp = false;
  $scope.dtmax = new Date();
});

＆＃13;

<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
<script language="javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.js"></script>
<script language="javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular-animate.js"></script>
<script language="javascript" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.14.3.js"></script>

<div ng-app="myApp" ng-controller="myCntrl">
  Date:
  <input type="text" uib-datepicker-popup="{{dateformat}}" ng-model="dt" is-open="showdp" max-date="dtmax" />
  <span>
    <button type="button" class="btn btn-default" ng-click="showcalendar($event)">
                <i class="glyphicon glyphicon-calendar"></i>
    </button>
  </span>
</div>

＆＃13;

＆＃13;

＆＃13;

来源：source