md-datepicker视图应仅显示月份 [英] md-datepicker view should display the months only

查看:85
本文介绍了md-datepicker视图应仅显示月份的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在一个项目上,并且上面有一个md-datepicker,我希望此md-datepicker仅显示一年中的月份(一月,二月,依此类推……).我该怎么办?

I am working on a project and I have a md-datepicker on it and I want this md-datepicker to show only the months of the year(January, February, and so on ......). How can I do this?

到目前为止,这是我的代码:

Here is my code so far:

HTML

<md-datepicker ng-model="currentDate" md-current-view="month" md-date-filter="monthlyDate"></md-datepicker>

JS

var app = angular.module("DashboardApp", ['ngMaterial', 'ngAnimate','md.data.table']);
app.controller('rptController', ['$scope', function ($scope) {
$scope.currentDate = new Date();
$scope.monthlyDate = new Date($scope.currentDate.getMonth('MM'))}]);

推荐答案

听起来您想要的是md-select而不是md-datepicker.参见下面的示例.

It sounds like you want an md-select rather than a md-datepicker. See example below.

(function() {
  angular
    .module('exampleApp', ['ngAnimate', 'ngAria', 'ngMaterial'])
    .controller('ExampleController', ExampleController);

  function ExampleController() {
    var vm = this;
    vm.monthNames = ["January", "February", "March", "April", "May", "June",
      "July", "August", "September", "October", "November", "December"
    ];
  }
  ExampleController.$inject = [];
})();

<!DOCTYPE html>
<html ng-app='exampleApp'>

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular-animate.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular-aria.min.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.9/angular-material.min.css">
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.9/angular-material.min.js"></script>
</head>

<body ng-controller="ExampleController as vm">
  <md-input-container>
    <md-select ng-model="vm.chosenMonth" placeholder="Select a month">
      <md-option ng-value="month" ng-repeat="month in vm.monthNames">{{ month }}</md-option>
    </md-select>
  </md-input-container>
</body>

</html>

这篇关于md-datepicker视图应仅显示月份的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆