角材料日期选择器始终打开 [英] Angular material datepicker always open

问题描述

我想使用有角材质的datepicker作为控件来控制fullCalendar实例的小部件.有没有办法强迫它始终保持打开状态并在特定的div中?我知道如何使用bootstrap或jqueryUI轻松地做到这一点，但我不想为我的项目添加额外的依赖关系.

I would like to use the angular material datepicker as a widget to control an instance of fullCalendar. Is there a way to force it to stay alway open and in a particular div? I know how to do it easily with bootstrap or jqueryUI but I would not want to add an extra dependency to my project.

推荐答案

好，您可以将其与某些CSS一起使用，但是month滚动条的内部滚动位置始终从顶部开始(1932). md-calendar是呈现日期选择器的内部指令，所以只需使用它即可.

Well, you can get that to work with some CSS, but the internal scroll position of the month scroller starts always at the top (1932). md-calendar is the internal directive that renders the datepicker, so just use that.

<md-calendar class="fixed-calendar" ng-model="myDate"></md-calendar>

并将CSS设置为固定大小，通常由datepicker计算得出.

And set the CSS to fixed size, which is usually calculated by the datepicker.

.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;
}

但是您可能可以编写自己的指令，该指令需要mdCalendar控制器并在那里设置滚动位置.

But you can probably write your own directive that requires the mdCalendar controller and set the scroll position there.

http://codepen.io/kuhnroyal/pen/EPQpGE

这篇关于角材料日期选择器始终打开的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！