键入脚本筛选 2 个日期



我在图片中看到的搜索屏幕上进行了过滤,但它无法正常工作。当您在付款当天写03.03.2020时,它会带来所有记录。我想过滤付款日期和我的登录日期,将记录放在两者之间。如何修复代码?

。.html

<div class="rez">
<input id="hotelName" type="text" placeholder="Enter Hotel Name" [(ngModel)]="hotelName" (ngModelChange)="changeHotelName()" /><br />
<input class="textbox-n" placeholder="Enter check in date" [(ngModel)]="startDate" type="text" onfocus="(this.type='date')" id="entry" (ngModelChange)="changeStartDate()" />
<input class="textbox-n" placeholder="Enter payDate" [(ngModel)]="endDate" type="text" onfocus="(this.type='date')" id="exit" (ngModelChange)="changeEndDate()" /><br />
<label id="lblAdults">Number of adults</label> <label id="lblChilds">Number of childs</label><br />
<input id="adult" type="number" [(ngModel)]="adult" (ngModelChange)="changeNumberOfAdults()" />
<input id="child" type="number" max="3" [(ngModel)]="childCount" [(ngModel)]="chd" (ngModelChange)="changeNumberOfChilds()" />
<label id="chd1" *ngIf="childCount>=1">Child Ages</label><br />
<select class="custom-select" id="chd_1" *ngIf="childCount >= 1">
<option selected>0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
<select class="custom-select" id="chd_2" *ngIf="childCount>=2">
<option selected>0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
<select class="custom-select" id="chd_3" *ngIf="childCount>=3">
<option selected>0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
<button id="search" class="btn btn-warning" type="button">Search</button> 
</div>

.ts

private isEqual(date1: Date, date2: Date) {
return date1.getDate() == date2.getDate() && date1.getMonth() == date2.getMonth() && date1.getFullYear() == date2.getFullYear();
}
changeStartDate() {
const filtered = this.hotels.filter(x => this.isEqual(new Date(x.checkInDate), new Date(this.startDate)));
if (filtered) this.dsHotels.data = filtered;
else return false;
}
changeEndDate() {
const filtered = this.hotels.filter(x => this.isEqual(new Date(x.payDate), new Date(this.endDate)));
this.dsHotels.data = filtered;
}

[图片]

https://i.stack.imgur.com/0IeDK.png
https://i.stack.imgur.com/ZDYCD.png
https://i.stack.imgur.com/wPguo.png

所以我认为问题是您需要检查过滤器中的checkInDatepayDate是否匹配。在当前代码中,一次只检查其中一个值

我认为修复可能是这样的:

private isEqual(date1: Date, date2: Date) {
return date1.getDate() == date2.getDate() && date1.getMonth() == date2.getMonth() && date1.getFullYear() == date2.getFullYear();
}
private isDataEqualToDate(value1: any, date2: Date) {
if (value1 == null) return true;
return isEqual(new Date(value1), date2);
}
private getFilteredHotels() {
return this.hotels.filter(
x => this.isDataEqualToDate(this.startDate, new Date(x.checkInDate))
&& this.isDataEqualToDate(this.endDate, new Date(x.payDate))
);
}
changeStartDate() {
this.dsHotels.data = this.getFilteredHotels();
}
changeEndDate() {
this.dsHotels.data = this.getFilteredHotels();
}

最新更新