1

我在我的 Angular 项目中使用这个包 ( ng-persian-datepicker ) 将 Gregorian datepicker 转换为 jalali datepicker。

问题是，当打开日期选择器时，它会将所有其他元素向下推。但我希望它在其他元素上打开而不是将它们向下推。

这是打开日期选择器之前的表单：

打开日期选择器之前的表单图像

这是打开日期选择器后的表单：

打开日期选择器后的表单图像

这是我的html日期选择器输入：

<div id="dateOfBirth">
      <mat-label
        >{{
          'kyc.personal_information.date_of_birth' | icmLocale
        }}
        (MM/DD/YYYY)</mat-label
      >
      <mat-form-field appearance="outline">
        <input
          type="text"
          placeholder="01/21/1900"
          matInput
          #datepickerInput
          name="dateOfBirth"
          formControlName="dateOfBirth"
          (click)="datepickerInput.open()"
          (focus)="hideError()"
        />
        <ng-persian-datepicker
          [input]="datepickerInput"
          [uiTheme]="'dark'"
          [timeMeridian]="false"
          [timeEnable]="false"
          [dateFormat]="'jYYYY/jM/jD'"
        ></ng-persian-datepicker>
      </mat-form-field>
</div>

编辑：

我通过添加以下css代码解决了这个问题：

::ng-deep ng-persian-datepicker .datepicker-outer-container {
        position: absolute;
        width: 300px;
        top: 43px;
        right: -10px;
        z-index: 1000;
        background-color: $icm-dark-deep;
      }
4

0 回答 0