如何角材料日期选择器离开/保持打开



我试过md-blur md-focus,每个都失败了。我正在使用角度材质1.1.3,我需要在日期选取操作后保持日期选择器打开状态。那么,在此操作之后,如何保持打开状态。有人可以帮忙吗?

由于 md-datepicker 文档,您无法实现此目的。 ngMaterials很好,但有很多限制。你可以通过使用md-calendar来"伪造"它,就像在这个可运行的演示代码笔中一样。

视图

<div ng-app="MyApp" ng-controller="MyController" layout-padding>
    {{ date }}<br /> 
    <input type="date" ng-model="date" ng-click="openDatePicker()" ng-show="!datePickerOpened">
    <md-calendar class="fixed-calendar" ng-show="datePickerOpened" ng-model="date"></md-calendar>
</div>

.CSS

.fixed-calendar {
  width: 340px;
  height: 340px;
  display: block;
}
.fixed-calendar .md-calendar-scroll-mask {
  width: 340px !important;
}
.fixed-calendar .md-virtual-repeat-scroller {
  width: 340px !important;
  height: 308px;
}

应用

angular
    .module('MyApp', ['ngMaterial'])
    .controller('MyController', function($scope, $timeout) {
    //Init
    $scope.datePickerOpened = false;
    $scope.date = new Date();
    //show datepicker action
    $scope.openDatePicker = function () {
        //show datepicker
        $scope.datePickerOpened = true
        //avoid date set to 1933 by async reinit date after ng-show rendering
        $timeout(function () {
             $scope.date = new Date();
        });
    }
}); 

最新更新