ngx引导程序范围日期选择器值

Question

我正在创建一个数据表，我想按开始日期和结束日期对其进行筛选。我使用ngx引导范围日期选择器，但我想将输入字段设置为特定的日期格式。

逻辑是这样的：

1. 如果我在日期选择器中选择的日期来自同一个月，我想在输入中显示这样的内容：2020年4月1日至3日。

2. 如果我在日期选择器中选择的日期不是同一个月，我想将输入中的此格式更改为：2020年1月1日至4月3日，否则：2020年4月1日-3日。

3. 最后一种情况是，如果两个日期都来自同一年，我只想用第二个值显示年份，比如2020年1月1日至4月3日，否则：1997年1月31日至2020年4月3月

我曾尝试在bsConfig中设置它，但这似乎同时适用于两个日期，我的问题是：如何根据我的逻辑获取值并应用不同格式的日期？

是否可以简单地在div中显示那些格式化的值，而不是在输入中？

感谢您的回复！

Answer 1

好的，我找到了一个解决方案。我可以简单地使用div来代替输入。我必须向div添加ngDefaultControl指令，以确保我的日期选择器使用的是div而不是输入。这是我的HTML代码：

<div
[bsConfig]="datePickerConfig"
type="text"
bsDaterangepicker
placement="right bottom"
#dpr="bsDaterangepicker"
class="datepicker-input"
readonly
(bsValueChange)="onDateChange($event)"
name="fieldName"
ngDefaultControl
>
{{ chosenStartDate }} - {{ chosenEndDate }}
</div>

在这种情况下，我可以有条件地更改ts文件中的格式。