如何减去两个angularjs日期变量

小编典典

如何减去两个angularjs日期变量

angularjs

我对angularjs相当陌生，但现在就开始了。我可以通过angularjs窗体中的两个日期dd/mm/yyyy，但是我需要做的是以某种方式减去两个日期以得到两者之间的天数差异。我创建了一个jQuery函数来执行此操作，但是我不知道如何将两个日期传递给该函数。所以我想知道是否还有其他方法可以解决此问题？

我正在尝试根据两个日期之间要设置样式的某些天之间的天数来设置触发器系统。例如，如果要在10天内使用 样式1 ，如果要在20天内使用 样式2
，依此类推。

阅读 259

2020-07-04

共1个答案

小编典典

我也是angularjs新手，但是您不会通过在javascript视图模型中提供属性来处理此问题吗？

例如，有一个基于日期字段更改的样式字段（即，如果相差10天，样式将返回样式1），并希望通过angularjs绑定将更新传播到屏幕。

我认为正确的术语是 计算属性 或 计算属性

编辑

不确定这是否是您要查找的内容，但请参见小提琴，例如，计算所有日期差异和更改样式均基于视图模型（范围）的属性

scope.diff并且scope.col是结合到2个属性

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>

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

2020-07-04