How to subtract two angularjs date variables

后端 未结 7 1103
说谎
说谎 2020-12-01 21:53

I am fairly new to angularjs, but here it goes. I am able two dates through angularjs in the form dd/mm/yyyy, but what I need to do is somehow subtract the two

7条回答
  •  情书的邮戳
    2020-12-01 22:29

    I'm also an angularjs novice but wouldn't you handle this by making properties available through your javascript view model?

    For example have a style field that changes based on the date fields (ie style returns style 1 when if the difference is 10 days) and hopefully through the angularjs binding the updates will propagate to the screen.

    I think the right term for this is a computed property or calculated property

    EDIT

    Not sure if this is what you're looking for but see fiddle for example of calculating date diff and changing a style all based off properties of the view model (scope)

    scope.diff and scope.col are the 2 properties to bind to

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

    HTML

    
    
    first date second date difference {{diff}}
    when the difference is greater than 10 color changes to green
    eg set the second date to 15/01/2013
    State

    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; }
    

提交回复
热议问题