J'essaie de calculer la différence entre deux dates en jours. Cependant, lorsque les deux dates sont dans des mois différents, les jours du mois précédent sont ignorés.
Par exemple, si la date de début est le 31 mars et la date de fin est le 1er avril, la différence est de 0.
import {Component} from '@angular/core'; import {NgbDate, NgbCalendar} from '@ng-bootstrap/ng-bootstrap'; @Component({ selector: 'ngbd-datepicker-range', templateUrl: './datepicker-range.html', styles: [` .custom-day { text-align: center; padding: 0.185rem 0.25rem; display: inline-block; height: 2rem; width: 2rem; } .custom-day.focused { background-color: #e6e6e6; } .custom-day.range, .custom-day:hover { background-color: rgb(2, 117, 216); color: white; } .custom-day.faded { background-color: rgba(2, 117, 216, 0.5); } `] }) export class NgbdDatepickerRange { hoveredDate: NgbDate; fromDate: NgbDate; toDate: NgbDate; DiffDate; enddate; startDate; constructor(calendar: NgbCalendar) { this.fromDate = calendar.getToday(); this.toDate = calendar.getNext(calendar.getToday(), 'd', 10); } onDateSelection(date: NgbDate) { if (!this.fromDate && !this.toDate) { this.fromDate = date; } else if (this.fromDate && !this.toDate && date.after(this.fromDate)) { this.toDate = date; } else { this.toDate = null; this.fromDate = date; } this.enddate=new Date (this.toDate.year,this.toDate.month,this.toDate.day); this.startDate=new Date (this.fromDate.year,this.fromDate.month,this.fromDate.day); this.DiffDate=Math.floor((Date.UTC(this.enddate.getFullYear(),this.enddate.getMonth(),this.enddate.getDate())-Date.UTC(this.startDate.getFullYear(),this.startDate.getMonth(),this.startDate.getDate()) )/(1000 * 60 * 60 * 24)); //this.DiffDate=(this.DiffDate/86400000); } isHovered(date: NgbDate) { return this.fromDate && !this.toDate && this.hoveredDate && date.after(this.fromDate) && date.before(this.hoveredDate); } isInside(date: NgbDate) { return date.after(this.fromDate) && date.before(this.toDate); } isRange(date: NgbDate) { return date.equals(this.fromDate) || date.equals(this.toDate) || this.isInside(date) || this.isHovered(date); } }
<ngb-datepicker #dp (select)="onDateSelection($event)" [displayMonths]="2" [dayTemplate]="t" outsideDays="hidden"> </ngb-datepicker> <ng-template #t let-date let-focused="focused"> <span class="custom-day" [class.focused]="focused" [class.range]="isRange(date)" [class.faded]="isHovered(date) || isInside(date)" (mouseenter)="hoveredDate = date" (mouseleave)="hoveredDate = null"> {{ date.day }} </span> </ng-template> <p>Number of selected dates: {{DiffDate}}</p> <pre>From: {{ fromDate | json }} </pre> <pre>To: {{ toDate | json }} </pre>
Si deux jours sont dans le même mois, cela fonctionne bien.
Merci d'avance pour votre soutien.
mise à jour: j'ai trouvé comment y remédier. Tout fonctionne comme prévu, sauf lorsque le jour sélectionné est le dernier jour du mois. Une démo en direct peut être trouvée ci-dessous:
Par exemple, date de début: 19 mars, date de fin: 21 mars. La différence est de 2 jours.
Mais lorsque le jour de début sélectionné est le 31 mars, il est calculé comme le 1er mai:
Une idée de ce qui ne va pas? Merci d'avance.
3 Réponses :
En utilisant la fonction de différence du moment, vous pouvez obtenir la différence appropriée d'un jour entre ces deux dates.
private calcDaysDiff(): number { const fromDate: Date = this.createDateFromNgbDate(this.fromDate); const toDate: Date = this.createDateFromNgbDate(this.toDate); const daysDiff = Math.floor(Math.abs(<any>fromDate - <any>toDate) / (1000*60*60*24)); return daysDiff; }
Voir ceci stackblitz pour la démo.
Mise à jour:
J'ai bifurqué votre stackblitz . Généralement créé deux nouvelles fonctions et éliminé certaines duplications.
NgbDate a trois propriétés année, mois et jour. L'important est que le mois commence à 1 (pas à zéro pour l'objet Date natif de JS) Voir la documentation NgbDate ici .
private createDateFromNgbDate(ngbDate: NgbDate): Date { const date: Date = new Date(Date.UTC(ngbDate.year, ngbDate.month-1, ngbDate.day)); return date; }
Et une fonction séparée pour calculer la différence en jours comme ceci:
this.firstDate = moment('2019/03/31'); this.secondDate = moment('2019/04/01'); this.diffInDays = Math.abs(this.firstDate.diff(this.secondDate, 'days'));
Merci beaucoup pour votre soutien. J'ai mis à jour mon code et cela fonctionne réellement. Cependant, le problème que j'ai lorsque j'ai sélectionné des dates de mois différents. Par exemple, lorsque je sélectionne deux dates du même mois, la différence est calculée correctement. Cependant, lorsque je sélectionne deux dates différentes, les données sont corrompues. Une démo en direct peut être trouvée à l'adresse: …
Je ne peux pas vous remercier assez. Cela a résolu mon problème et tout fonctionne comme prévu. Bonne journée
Pour les calculs de date et d'heure, utilisez Moment.js. Dans votre cas, utilisez la méthode de différence dans Moment.js, https://momentjs.com/docs / # / affichage / différence /
var a = moment([2007, 0, 29]); var b = moment([2007, 0, 28]); a.diff(b, 'days') // 1
Utilisez ce code:
const oneday = 24 * 60 * 60 * 1000; const momentDate = new Date(this.applicationData.businessProfile.registration_date); // Replace event.value with your date value const formattedDate = moment(momentDate).format("YYYY-MM-DD"); const formattedDatecurrent = new Date(this.now); this.applicationData.businessProfile.registration_date=formattedDate; console.log(formattedDate); console.log(formattedDatecurrent); const Difference_In_Time = Math.round(Math.abs((Number(momentDate) - Number(formattedDatecurrent) )/oneday)); console.log(Difference_In_Time);
Je pense qu'il suffit de convertir les dates en millisecondes, de les soustraire, puis de les convertir en jours. Pourrait fonctionner.
(dateTo.valueOf () - dateFrom.valueOf ()) / 86400000
Merci, j'ai essayé cela, mais ne fonctionne pas aussi bien
Vérifiez ceci: stackoverflow.com/questions/9129928/...
Merci ... J'ai essayé ci-dessous, mais ne fonctionne toujours pas: this.DiffDate = Math.floor ((Date.UTC (this.enddate.getFullYear (), this.enddate.getMo nth (), this.enddate. g etDate ()) - Date.UTC (t his.startDate.getFul lYear (), this.startDa te.getMonth (), this.s tartDate.getDate ())) / (1000 * 60 * 60 * 24)); Toute suggestion
Les lignes ci-dessous ne fonctionnent que si nous sommes sur le même mois ... si différents mois, la différence en jours est de 0: this.enddate = new Date (this.toDate.year, this.toDate.month, this.toDate.day ); this.startDate = nouvelle date (this.fromDate.year, this.fromDate.month, this.fromDate.day); this.DiffDate = Math.floor ((Date.UTC (this.enddate.getFullYear (), this.enddate.getMo nth (), this.enddate.g etDate ()) - Date.UTC (t his.startDate.getFul lYear (), this.startDa te.getMonth (), this.s tartDate.getDate ())) / (1000 * 60 * 60 * 24));
dans new Date, le mois commence par 0, 0 = janvier, 1 = février ..., dans ngb-bootstrap, fromDate.month commence par 1, 1 = janvier, 2 = février ..