p日历组件中仅显示清除按钮

时间:2019-10-05 16:12:01

标签: angular primeng

我只希望在p日历组件上有一个“清除”按钮。

myComponent.html

<p-calendar
  value="#{property.propDate}" id="date"
  [showIcon]="true"
  [utc]='true'
  placeholder="{{ timePickerPlaceHolder }}"
  [showTransitionOptions]="'100ms'"
  [hideTransitionOptions]="'100ms'"
  [inputStyle]="{ width: '248px' }"
  [(ngModel)]="value"
  [defaultDate]="defaultDate"
  showTime="true"
  [readonlyInput]="true"
  hourFormat="24"
  showButtonBar="true"
  [todayButtonStyleClass]="'today-button'"
  [timeOnly]="true">
</p-calendar>

myComponent.less

.today-button {
  display: none !important
}

但是这什么也没做。有人可以帮我吗?

1 个答案:

答案 0 :(得分:1)

您可以这样做:

::ng-deep.ui-datepicker-buttonbar > div.ui-g div:first-child {
    display: none;
}

当然,这与p日历按钮的html代码有关。 祝你好运