我是AngularJS的新手，我该如何将焦点实现（与Microsoft Windows 7日历相似）添加到我使用Angular Material版本1.0.1的日历中。我们决定不将角材料更新为1.1.1。
<!doctype html>
<html ng-app="datepickerBasicUsage">
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.1/angular-material.css">
</head>
<body>
<div ng-controller="AppCtrl" style='padding: 40px;'>
<md-content>
<md-datepicker ng-model="birthdate" placeholder="Enter date" md-max-date="maxDate" ng-focus="open()"></md-datepicker>
</md-content>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-aria.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.1/angular-material.js"></script>
<script src="app.js"></script>
</body>
</html>
app.js ---
angular.module('datepickerBasicUsage', ['ngMaterial'])
.controller('AppCtrl', function($scope, $timeout) {
$scope.birthdate = new Date();
$scope.maxDate = new Date(
$scope.birthdate.getFullYear(),
$scope.birthdate.getMonth(),
$scope.birthdate.getDate());
$scope.open = function() {
$timeout(function() {
$scope.birthdate = new Date();
$scope.maxDate = new Date(
$scope.birthdate.getFullYear(),
$scope.birthdate.getMonth(),
$scope.birthdate.getDate());
}, 400);
}
});
创建名为"现有datepicker指令相同的指令）。这样，您就不必在HTML中添加任何内容，因为您已经使用了md-datepicker。
app.directive('mdDatepicker', function() {
return {
link: function(scope, element) {
var controller = element.controller('mdDatepicker');
var event = {
target: document.body
};
var input = element.find('input');
input.on('focus', function(e) {
scope.$apply(function() {
controller.openCalendarPane(event);
});
});
input.on('click', function(e) {
e.stopPropagation();
});
}
};
});
指令检索普通mdDatepicker指令使用的控制器，并在集中输入时简单地调用openCalendarPane方法。
需要假事件对象，因为mdDatepicker在内部使用event.target来知道关闭日期点时要设置的焦点。
单击侦听器和event.stopPropagation在Firefox中工作（至少在我测试的版本中），或者如果通过单击输入内部打开，日历将立即立即关闭。
演示： http://plnkr.co/edit/ydtvwa3mntyrl5ws1ez8?p=peview