我正在开发一个项目,我有一个md-datepicker,我希望这个md-datepicker只显示一年中的几个月(1月,2月等等......)。我怎么能这样做?
到目前为止,这是我的代码:
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'))}]);
答案 0 :(得分:3)
使用最新版本的datepicker可以实现这一点。您可以在下方设置md-mode="month"
工作演示
<md-input-container flex="100" layout="column">
<div style="font-size: 10px; color: blue;" label ng-bind="::dateFields[2].label"></div>
<md-datepicker ng-model="dateFields.selectedDate"
ng-required="dateFields.required"
md-date-locale="dateFields.locale"
md-mode="month"
md-open-on-focus="true">
</md-datepicker>
</md-input-container>
<强> DEMO 强>
答案 1 :(得分:2)
听起来你想要一个md-select而不是一个md-datepicker。见下面的例子。
(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>