web-dev-qa-db-fra.com

Commentaire soustraire deux variables de date angularjs

Je suis assez nouveau sur angularjs, mais le voilà. Je suis capable de deux dates à travers angularjs sous la forme dd/mm/yyyy, mais ce que je dois faire est en quelque sorte de soustraire les deux dates pour obtenir la différence en jours entre les deux. J'ai créé une fonction jQuery pour cela, mais je ne sais pas comment passer les deux dates à la fonction. Alors je me demandais s'il y avait une autre façon de s'y prendre?

J'essaie de mettre en place un système de déclenchement en fonction du nombre de jours entre les deux dates pour styliser certaines choses. Par exemple, si c'est dans les 10 jours, je veux qu'il utilise style 1 et si dans les 20 jours, utilisez style 2 et ainsi de suite.

7
user1399078

Je suis aussi un novice angularjs, mais ne gèreriez-vous pas cela en rendant les propriétés disponibles via votre modèle d'affichage javascript?

Par exemple, un champ style qui change en fonction des champs de date (le style renvoie le style 1 lorsque la différence est de 10 jours) et, si tout se passe bien, la mise à jour angularjs lie les mises à jour à l'écran.

Je pense que le bon terme pour cela est un propriété calculée ou propriété calculée

MODIFIER

Vous ne savez pas trop si c'est ce que vous cherchez, mais voyez par exemple le calcul des différences de date et la modification d'un style en fonction des propriétés du modèle de vue (étendue).

scope.diff et scope.col sont les 2 propriétés auxquelles se lier

http://jsfiddle.net/chrismoutray/wfjv6/

HTML

<script src="http://code.angularjs.org/0.10.4/angular-0.10.4.min.js" ng:autobind></script>
<div ng:controller="ComputedPropertiesCtrl">
    first date <input ng:model="firstdate"> second date <input ng:model="seconddate"> difference {{diff}}
    <div>when the difference is greater than 10 color changes to green</div>
    <div>eg set the second date to 15/01/2013</div>
    <div style="background-color:{{col}};"> State </div>
</div>

JS 

function ComputedPropertiesCtrl() {
    var scope = this;
    scope.firstdate = '01/01/2013';
    scope.seconddate = '10/01/2013';
    scope.data_before = [];
    scope.differenceInDays = function() {

        var dt1 = scope.firstdate.split('/'),
            dt2 = scope.seconddate.split('/'),
            one = new Date(dt1[2], dt1[1]-1, dt1[0]),
            two = new Date(dt2[2], dt2[1]-1, dt2[0]);

        var millisecondsPerDay = 1000 * 60 * 60 * 24;
        var millisBetween = two.getTime() - one.getTime();
        var days = millisBetween / millisecondsPerDay;

        return Math.floor(days);      
    };
    scope.color = function() {
        return (scope.differenceInDays() > 10) ? 'green' : 'red';
    };

    scope.$watch('[firstdate, seconddate]', function(currScope,newVal,oldVal) {
        scope.data_before = oldVal;
        scope.diff = scope.differenceInDays();
    });

    scope.$watch('[firstdate, seconddate]', function(currScope,newVal,oldVal) {
        scope.data_before = oldVal;
        scope.col = scope.color();
    });
}

CSS

h2 { position: fixed; right: 10px; top: 10px; color: red; background:white;z-index:1000; }
input { width: 100px; }
div { margin: 10px; padding: 10px; }
2
Chris Moutray

Manière javascript de base:

var d1 = new Date('01/16/2013');
var d2 = new Date('02/26/2013');
var milliseconds = d2-d1;
var seconds = milliseconds / 1000;
var minutes = seconds / 60;
var hours = minutes / 60;
var days = hours / 24;

En utilisant l’une des bibliothèques de date (telle que moment.js):

var d1 = moment("01/16/2013");
var d2 = moment("02/26/2013");
var days = moment.duration(d2.diff(d1)).asDays();
13
Stewie

vous convertissez simplement la date en horodatage, puis vous soustrayez.

var Date1 = 08/16/2004;
var Date2= 10/24/2005;

var timestamp1 = new Date(Date1).getTime();
var timestamp2 = new Date(Date2).getTime();

var diff = timestamp1 - timestamp2


var newDate = new Date (diff);
5
Pawan Singh

Vous pouvez utiliser moment angulaire pour calculer la différence, en utilisant le filtre amDifference :

Obtenez la différence entre deux dates en millisecondes. Les paramètres sont Date, unités et usePrecision. La date par défaut est la date actuelle. Exemple:

<span>Difference: {{ dateFrom | amDifference : dateTo : 'days' }} days</span>
4
s1moner3d

Cela fonctionne, et voici 2 fonctions de date javascript sans faille dont vous ne devriez jamais vous passer ...

// Returns the days between a & b date objects...
function dateDiffInDays(a, b) {
    var _MS_PER_DAY = 1000 * 60 * 60 * 24;
    // Discard the time and time-zone information.
    var utc1 = Date.UTC(a.getFullYear(), a.getMonth(), a.getDate());
    var utc2 = Date.UTC(b.getFullYear(), b.getMonth(), b.getDate());
    return Math.floor((utc2 - utc1) / _MS_PER_DAY);
}

// Calculate how many days between now and an event...
function daysTill(e) {
    var eventE = new Date(e);
    var today =  new Date();
    return dateDiffInDays(today, eventE);
}
2
Nick Steele

Le moment où la bibliothèque JavaScript est vraiment très utile et facile à utiliser:


var parsedServerOutTime = moment(serverOutTime, "HH:mm:ss");
var parsedServerInTime = moment(serverInTime, "HH:mm:ss");

var milliseconds= parsedServerOutTime.diff(parsedServerInTime) //default milliseconds
var days = moment.duration(parsedServerOutTime .diff(parsedServerInTime )).asDays();// For days

asWeeks();asMonths();asYears(); etc etc pour plus de détails, consultez http://momentjs.com/docs/

0
Rohit Luthra