仅年份和月份 datepicker angularjs 和 bootstrap

Question

i have problem i want to use datepicker from date to date(check in and check out with months not days) and it should be with months ,the problem is: i have template but it show me the the day and the year and the month , what i want is just month and year我有问题我想从日期到日期使用日期选择器（签入和签出月份而不是日期），它应该是月份，问题是：我有模板，但它显示了日期和年份和月份，我想要的只是月份和年份

this what i get and i want just months and year这是我得到的，我只想要几个月和一年

http://plnkr.co/edit/W5pb1boMLOHZFnWkMU8o?p=preview http://plnkr.co/edit/W5pb1boMLOHZFnWkMU8o?p=preview

html : html：

<!doctype html>
<html ng-app="plunker">
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.js"></script>
    <script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.7.0.js"></script>
    <script src="example.js"></script>
    <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
  </head>
  <body>

<div ng-controller="DatepickerDemoCtrl">
    <h4>Start</h4>
    <div class="form-horizontal">
        <p>
            <input type="text" datepicker-popup="{{format}}" ng-model="start" is-open="startOpened" min="minStartDate" max="maxStartDate" datepicker-options="dateOptions" close-text="Close" />
            <button class="btn" ng-click="openStart()"><i class="icon-calendar"></i></button>
        </p>
    </div>
    <h4>End</h4>
    <div class="form-horizontal">
        <p>
            <input type="text" datepicker-popup="{{format}}" ng-model="end" is-open="endOpened" min="minEndDate" max="maxEndDate" datepicker-options="dateOptions" close-text="Close" />
            <button class="btn" ng-click="openEnd()"><i class="icon-calendar"></i></button>
        </p>
    </div>
</div>
  </body>
</html>

js : js：

angular.module('plunker', ['ui.bootstrap']);
var DatepickerDemoCtrl = function ($scope, $timeout) {
  $scope.start = new Date('11/20/13');
  $scope.end = new Date();

  $scope.minStartDate = 0; //fixed date
  $scope.maxStartDate = $scope.end; //init value
  $scope.minEndDate = $scope.start; //init value
  $scope.maxEndDate = $scope.end; //fixed date same as $scope.maxStartDate init value

  $scope.$watch('start', function(v){
    $scope.minEndDate = v;
  });
  $scope.$watch('end', function(v){
    $scope.maxStartDate = v;
  });

  $scope.openStart = function() {
    $timeout(function() {
      $scope.startOpened = true;
    });
  };

  $scope.openEnd = function() {
    $timeout(function() {
      $scope.endOpened = true;
    });
  };

  $scope.dateOptions = {
    'year-format': "'yy'",
    'starting-day': 1
  };
};

Thanks in Advance提前致谢

Answer 1

Try using min-mode and max-mode attributes in your date picker element.尝试在日期选择器元素中使用min-mode和max-mode属性。 By setting min-mode to month and max-mode to year you enable month-picker and year-picker only.通过将 min-mode 设置为 month 并将 max-mode 设置为 year 您仅启用月份选择器和年份选择器。

HTML : HTML：

<input type="text" show-weeks="false" show-button-bar="false" class="form-control" datepicker-popup="{{format}}" ng-model="dt" is-open="status.opened" min-date="minDate" max-date="maxDate" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" min-mode="'month'" max-mode="'year'" />

This should help.这应该会有所帮助。

You can also check my answer on this thread where I have enabled the month picker only.您还可以在我仅启用月份选择器的此线程上查看我的答案。 ( similar solution ) （ 类似的解决方案）

demo 演示

仅年份和月份 datepicker angularjs 和 bootstrap

问题描述

1 个解决方案

解决方案1
0 2015-11-29 18:24:13

仅年份和月份 datepicker angularjs 和 bootstrap

问题描述

1 个解决方案

解决方案1 0 2015-11-29 18:24:13

解决方案1
0 2015-11-29 18:24:13