2017-10-20 32 views
0

J'ai cherché SO et j'ai trouvé des solutions à cela, mais ils n'utilisent pas la date-fns ou ne fonctionnent tout simplement pas, car ils calculent des jours et je me concentre uniquement sur les heures le même jour. J'essaie de calculer la différence entre deux dates, ou plus précisément, entre les heures d'une même journée, de façon à ce que je puisse savoir quand quelqu'un a effectué un pointage et calculé le nombre d'heures travaillées pour ce jour.Calculer la différence entre les heures

J'utilise ce jour-SNF

Si je cours console.log(this.myForm.value.startTime) je reçois 14:00. Si je cours console.log(this.myForm.value.endTime) je reçois 16:00.

Voici ma fonction pour calculer les heures.

updateHours() { 
    var end = dateFns.format(new Date(this.myForm.value.endTime, 'HH:mm')); 
    var start = dateFns.format(new Date(this.myForm.value.startTime, 'HH:mm')); 
    var result = dateFns.differenceInMinutes(
     new Date(end), 
     new Date(start) 
    ) 
    console.log(result); 
} 

La valeur de result est toujours NaN

Qu'est-ce que je fais mal?

Répondre

1

Il y a une mauvaise analyse en cours, puisque vous voulez seulement obtenir la différence dans minutes il serait plus facile de suivre cette approche.

La valeur définie sur end et start variables étaient indéfinies dans le code d'origine.

Dans l'extrait ci-dessous, je crée une nouvelle date, définissez les heures et les minutes en utilisant la méthode de date .setHours().

date.setHours(0, 0, 0); // Set hours, minutes and seconds 

var start_time = "14:00"; 
 
var end_time = "16:00"; 
 

 
function updateHours() { 
 
    var current = new Date(); 
 
    var start = current.setHours(start_time.split(":")[0], start_time.split(":")[1], 0); 
 
    var end = current.setHours(end_time.split(":")[0], end_time.split(":")[1], 0); 
 
    console.log(start, end) 
 
    var result = dateFns.differenceInMinutes(
 
    end, 
 
    start 
 
) 
 
    console.log(result); 
 
} 
 
updateHours();
.as-console { 
 
    height: 100%; 
 
} 
 

 
.as-console-wrapper { 
 
    max-height: 100% !important; 
 
    top: 0; 
 
    text-align:center; 
 
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.29.0/date_fns.min.js"></script>

Références:

  1. Set hours
+0

fonctionne très bien jusqu'à ce que j'obtienne la valeur de ma forme 'this.myForm.value.startTime', puis il retourne' NaN'. J'ai même essayé 'this.myForm.value.startTime comme chaîne' sans chance. – timgavin

+1

@timgavin Pourquoi ne pas faire 'this.myForm.value.startTime = this.myForm.value.startTime | "00:00" ', de sorte que les valeurs de la falsification soient remplacées par la valeur par défaut! –

+0

Cela l'a réparé! Merci :) – timgavin

0

Je pense qu'il est vraiment facile si vous avez deux objets Date, pour obtenir la différence retranchant Date.prototype.getTime (donc ne forme pas dateFns encore)

var minutes = Math.abs(start.getTime() - end.getTime())/60000 // display in minutes 

Vous pouvez également arrondir, Math.round(minutes)

J'espère que ça aide :)

+0

Cette méthode: 'var fin = new Date (this.myForm.value.endTime) 'me donne 'NaN', et cette méthode:' var start = this.myForm.value.startTime; 'me donne ceci:' ERROR TypeError: start.getTime n'est pas une fonction'. – timgavin