datepicker 相关问题

datepicker是许多框架中的用户界面元素，允许用户通常通过可视日历选择日期，在某些情况下还可以选择时间。

我正在使用Vue并且我有这个vue2-date-range-picker 我正在使用 Vue，我有这个 vue2-date-range-picker <date-range-picker ref="picker" :class="[dateHasChanges ? 'daterange-picker-highlighted' : '']" :opens="opens" :ranges="ranges" :always-show-calendars="true" :auto-apply="true" value-type="timestamp" data-testid="filter-form-date-range-picker" v-model="dateRange"> <template v-slot:input="picker" style="min-width: 350px;"> {{ getDateRangeInputLabel(picker) }} </template> </date-range-picker> 我添加了一些自定义范围与时刻： ranges: { 'All Time': [null, null], 'Today': [moment().tz('America/Los_Angeles').startOf('day').format('MM/DD/YYYY HH:mm:ss'), moment().tz('America/Los_Angeles').endOf('day').format('MM/DD/YYYY HH:mm:ss')], 'Yesterday': [window.moment().subtract(1, 'day')._d, window.moment().subtract(1, 'day')._d], 'This Week': [window.moment().startOf('week')._d, window.moment().endOf('week')._d], 'This Month': [window.moment().startOf('month')._d, window.moment().endOf('month')._d], 'Last 7 Days': [window.moment().subtract(7, 'day')._d, window.moment()._d], 'Last 300 Days': [window.moment().subtract(30, 'day')._d, window.moment()._d], 'Last 3 Months': [window.moment().subtract(3, 'month')._d, window.moment()._d], 'Custom Range': [window.moment().subtract(1, 'day')._d, window.moment()._d] }, 问题如下，我需要设置带有日期和时间的时区，但该组件不允许字符串，只允许对象，当我使用 .toDate() 解析时，我的时区会更改为本地时区。我需要这个： moment().tz('美国/洛杉矶').startOf('日').format('MM/DD/YYYY 时:分:秒') 我也尝试这个 moment().tz('美国/洛杉矶').startOf('day').toDate() 无论你在哪里，我都想采用自定义时区，因为如果我选择今天：我想看到 07/10/2024 00:00:00 - 07/10/2024 23:59:59 尝试格式化并显示此道具属性在此处输入图像描述

javascript vue.js vuejs2 datepicker

回答 1 投票 0

symfony Admin lte 捆绑个性化日期类型表单

我在 symfony 5 上使用 kevinPast adminLte 包。每个日期类型都有自己的格式（dd-MM-YYYY），并且您无法通过编写 'format' => 'yyyy-MM 来以正常方式更新它-dd' 在表格内...

php symfony datepicker symfony5 adminlte

回答 1 投票 0

使用easepick插件选择日期范围时的回调

我正在使用 easypick 插件为我的用户提供选择日期范围的方法。但是，当选择数据范围时，我很难触发事件。谁能帮忙解决一下...

javascript datepicker

回答 3 投票 0

如何动态更改日期选择器（WPF、C#）的字符串格式？

我有这个日期选择器元素：我有这个日期选择器元素： <DatePicker Name="DataSelected" Grid.Column="1" Grid.Row="2" SelectedDate="{Binding DataSelected, Mode=TwoWay}" CalendarOpened="DatePicker_Opened"> <DatePicker.Resources> <Style TargetType="DatePickerTextBox"> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate> <TextBox x:Name="PART_TextBox" Text="{Binding Path=SelectedDate, RelativeSource={RelativeSource AncestorType={x:Type DatePicker}}, StringFormat={x:Static local:MyView.DateFormat}}" /> </ControlTemplate> </Setter.Value> </Setter> </Style> </DatePicker.Resources> </DatePicker> 现在基于 DateFormat 变量的值（可以是“yyyy”或“MM-yyyy”或“dd-MM-yyyy”）我想更改日期选择器的格式。因为我希望用户能够在 DateFormat 为“yyyy”时仅选择/查看年份，或者在变量为“MM-yyyy”时仅选择/查看年份和月份，依此类推。我怎样才能做到这一点？（我的代码是C#）（对于任何语法错误，我很抱歉，英语不是我的母语）正如此处评论中所讨论的，我用来“动态”更改文本框的 StringFormat 的代码。其中 DecimalPlaces 是我用来触发更改的整数 <TextBox> <TextBox.Style> <Style TargetType="TextBox" BasedOn="{StaticResource TextBoxTemplate}"> <Setter Property="Text" Value="{Binding CurrentPosition, StringFormat=F3}"></Setter> <Style.Triggers> <DataTrigger Binding="{Binding DecimalPlaces}" Value="0"> <Setter Property="Text" Value="{Binding CurrentPosition , StringFormat=F0}"></Setter> </DataTrigger> <DataTrigger Binding="{Binding DecimalPlaces}" Value="1"> <Setter Property="Text" Value="{Binding CurrentPosition, StringFormat=F1}"></Setter> </DataTrigger> <DataTrigger Binding="{Binding DecimalPlaces}" Value="2"> <Setter Property="Text" Value="{Binding CurrentPosition, StringFormat=F2}"></Setter> </DataTrigger> </Style.Triggers> </Style> </TextBox.Style> </TextBox>

c# wpf data-binding datepicker wpftoolkit

回答 1 投票 0

Angular Material 10 日期选择器（mat-datepicker）与其他输入字段不对齐

使用Angular 10和Angular Material 10，在表单中使用日期选择器与其他输入表单字段不对齐，如下图：字段未对齐 ~component.html 中的示例代码：使用 Angular 10 和 Angular Material 10，在表单中使用日期选择器与其他输入表单字段不对齐，如下图所示：字段未对齐 ~component.html 中的示例代码： <mat-form-field color="primary" appearance="fill"> <mat-label>Data Da</mat-label> <input matInput [matDatepicker]="picker1" [(ngModel)]="dataDa"> <mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle> <mat-datepicker #picker1 color="primary"></mat-datepicker> </mat-form-field> <mat-form-field class="example-form-field" appearance="fill"> <mat-label>Ora Da</mat-label> <input matInput type="text" [(ngModel)]="oraDa"> </mat-form-field> 您尝试后是否也遇到同样的问题？这似乎是一个错误。我找到了这个解决方案：在 ~component.scss 文件中我放置了这个 css 规则： ::ng-deep mat-datepicker-toggle.mat-datepicker-toggle button.mat-focus-indicator.mat-icon-button.mat-button-base { display: inherit; } 我遇到了同样的问题，它似乎与在 dom 中渲染时的项目对齐有关，我解决了应用以下规则： .mat-form-field.custom-class-name { .mat-form-field-wrapper { .mat-form-field-flex { align-items: normal; } } }

angular datepicker angular-material

回答 2 投票 0

隐藏角度日期选择器输入中的秒数

我正在使用角度日期选择器，我想隐藏输入框中的秒数我正在使用角度日期选择器，我想隐藏输入框中的秒数 <mat-form-field class="input-ff transparent-bg no-warning underline-prefix"> <mat-label >{{ 'EstimatedArrivalTime' | translate }}</mat-label> <mat-icon matPrefix class="fill-underline">info</mat-icon> <input matInput [ngxMatDatetimePicker]="picker" [(ngModel)]="formattedEDTA" (dateChange)="dateChanged($event)" /> <mat-hint style="color: black;">DD/MM/YYYY HH:mm</mat-hint> <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle> <ngx-mat-datetime-picker #picker [showSpinners]="true" [showSeconds]="false" [pickerType]="'calendar'" [startView]="'month'" [dateFormat]="'DD/MM/YYYY HH:mm'" [stepHour]="1"> </ngx-mat-datetime-picker> </mat-form-field> <span style="color: red;">- {{formattedEDTA}} -</span> 然后在我的ts中 private _selectedData; formattedEDTA: string; set selectedData(value: any) { this_selectedData= value; this.formattedEDTA = this.formatDate(value.EDTA); } get selectedData(): any { return this._selectedData; } formatDate(date: Date | moment.Moment): string { return moment(date).isValid() ? moment(date).format('DD/MM/YYYY HH:mm') : ''; } dateChanged(event: any): void { if (event.value) { this._selectedData.EDTA = event.value; this.formattedEDTA = this.formatDate(event.value); } } 最初它在输入中没有显示任何值，但在跨度值中存在formattedEDTA 27/06/2024 23:37 当我更改日期时，它在日期输入中显示19/06/2024, 00:00:00，但在跨度中它显示19/06/2024 00:00 我错过了什么吗？输入日期框中的日期也应该是正确的更新1 我在我的模块中尝试过这样的 export const CUSTOM_DATE_FORMATS: NgxMatDateFormats = { parse: { dateInput: 'DD/MM/YYYY HH:mm', }, display: { dateInput: 'DD/MM/YYYY HH:mm', monthYearLabel: 'MMM YYYY', dateA11yLabel: 'LL', monthYearA11yLabel: 'MMMM YYYY', }, }; 以及我的提供商 providers: [ MatIconRegistry, DatePipe, MatDatepickerModule, NgxMatDatetimePickerModule, { provide: LOCALE_ID, useValue: 'sv', }, { provide: LOCALE_ID, useValue: 'nb', }, { provide: LOCALE_ID, useValue: 'en', }, { provide: MAT_DATE_LOCALE, useValue: 'en-GB' }, { provide: NGX_MAT_DATE_FORMATS, useValue: CUSTOM_DATE_FORMATS } ] 但现在这很引人注目您面临的问题似乎与日期格式如何应用于输入字段有关。尽管您进行了配置，ngx-mat-datetime-picker 可能会在输入字段中显示带秒的日期。要解决此问题，您需要确保日期格式正确应用于输入字段值。实现此目的的一种方法是使用 Angular 的内置 DatePipe 来格式化输入字段中显示的日期。具体操作方法如下：在组件中导入 DatePipe： import { DatePipe } from '@angular/common'; 将 DatePipe 注入到您的组件中： constructor(private datePipe: DatePipe) {} 更新您的 formatDate 方法以使用 DatePipe: formatDate(date: Date | moment.Moment): string { return this.datePipe.transform(date, 'dd/MM/yyyy HH:mm'); } 将 formattedEDTA 属性直接绑定到 matInput: <mat-form-field class="input-ff transparent-bg no-warning underline-prefix"> <mat-label>{{ 'EstimatedArrivalTime' | translate }}</mat-label> <mat-icon matPrefix class="fill-underline">info</mat-icon> <input matInput [ngxMatDatetimePicker]="picker" [(ngModel)]="formattedEDTA" (dateChange)="dateChanged($event)" [value]="formattedEDTA" /> <mat-hint style="color: black;">DD/MM/YYYY HH:mm</mat-hint> <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle> <ngx-mat-datetime-picker #picker [showSpinners]="true" [showSeconds]="false" [pickerType]="'calendar'" [startView]="'month'" [dateFormat]="'DD/MM/YYYY HH:mm'" [stepHour]="1"> </ngx-mat-datetime-picker> </mat-form-field> <span style="color: red;">- {{formattedEDTA}} -</span> 进行这些更改后，日期输入字段应显示格式化的日期，不带秒。关键点是确保保存格式化日期的 formattedEDTA 属性通过 [value]="formattedEDTA" 直接绑定到输入字段。此外，请确保您的组件正确注册为 DatePipe: import { Component } from '@angular/core'; import { DatePipe } from '@angular/common'; @Component({ selector: 'app-your-component', templateUrl: './your-component.component.html', styleUrls: ['./your-component.component.css'], providers: [DatePipe] }) export class YourComponent { private _selectedData; formattedEDTA: string; constructor(private datePipe: DatePipe) {} set selectedData(value: any) { this._selectedData = value; this.formattedEDTA = this.formatDate(value.EDTA); } get selectedData(): any { return this._selectedData; } formatDate(date: Date | moment.Moment): string { return this.datePipe.transform(date, 'dd/MM/yyyy HH:mm'); } dateChanged(event: any): void { if (event.value) { this._selectedData.EDTA = event.value; this.formattedEDTA = this.formatDate(event.value); } } } 这应确保日期输入字段和跨度显示相同格式的日期，不带秒。

angular datepicker ngx-daterangepicker-material

回答 1 投票 0

在 mui/x-date-picker 中获取错误时间

我尝试将日期从日期选择器转换为 iso 格式，但总是比我的时间晚 3 小时。我该如何解决这个问题？这是我的代码： '使用客户端'；从 'react' 导入 React, { useEffect, useState };

datetime next.js datepicker

回答 1 投票 0

向材质日期选择器添加按钮并设置样式以无缝适应

我想向我的日期选择器添加按钮，无需打开日期选择器即可转到前一天和后一天。几个小时后我得到了这个结果：带按钮的日期选择器的当前状态没那么糟糕...

angular angular-material datepicker

回答 1 投票 0

导入错误./node_modules/@mui/x-date-pickers/AdapterDateFns/AdapterDateFns.js 58:0-65

./node_modules/@mui/x-date-pickers/AdapterDateFns/AdapterDateFns.js 中的错误 58:0-65 找不到模块：错误：包路径 ./_lib/format/longFormatters 未从包 C:\Users\ykd\git\