如何使用Angular.js / Javascript计算日差

时间:2016-09-23 11:23:29

标签: javascript angularjs

我需要一个帮助。我需要使用Angular.js / Javascript计算两天字段之间的差异。我正在解释下面的代码。

<select class="form-control" id="daysFrom" ng-model="daysFrom" ng-change="getSubcategoryValue('daysFrom');">
<option value="" label="Select Day" selected="selected">Select Day</option>
<option value="1" label="Monday">Monday</option>
<option value="2" label="Tuesday">Tuesday</option>
<option value="3" label="Wednesday">Wednesday</option>
<option value="4" label="Thursday">Thursday</option>
<option value="5" label="Friday">Friday</option>
<option value="6" label="Saturday">Saturday</option>
<option value="7" label="Sunday">Sunday</option>
</select>

我的第二天下拉菜单如下。

<select class="form-control" id="daysTo" ng-model="daysFrom" ng-change="getSubcategoryValue('daysFrom');">
    <option value="" label="Select Day" selected="selected">Select Day</option>
    <option value="1" label="Monday">Monday</option>
    <option value="2" label="Tuesday">Tuesday</option>
    <option value="3" label="Wednesday">Wednesday</option>
    <option value="4" label="Thursday">Thursday</option>
    <option value="5" label="Friday">Friday</option>
    <option value="6" label="Saturday">Saturday</option>
    <option value="7" label="Sunday">Sunday</option>
    </select>

这里我有两个下拉列表,如day from and day to。我需要当用户选择两天时,差异应该计算,包括那些天。假设用户首先选择了Monday and wednesday,它应该计算为差异3。请帮帮我。

4 个答案:

答案 0 :(得分:0)

var difference=abs(parseInt($scope.daysTo)-parseInt($scope.daysFrom))+1;

答案 1 :(得分:0)

如果您拨打第一个输入dayFrom而第二个输入dayTo则:

function calculateDifference(dayFrom, dayTo) {
    return Math.abs(dayTo + dayFrom) + 1;
}

var difference = calculateDifference($scope.dayFrom, $scope.dayTo);

答案 2 :(得分:0)

$('#daysFrom, #daysTo').change(function(){    
    if ($('#daysTo').val() < $('#daysFrom').val())
    {
      console.log("Wrong day choose");
      return false;
    }
    console.log($('#daysTo').val() - $('#daysFrom').val()+1);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
From : <select class="form-control" id="daysFrom" ng-model="daysFrom" ng-change="getSubcategoryValue('daysFrom');">
<option value="" label="Select Day" selected="selected">Select Day</option>
<option value="1" label="Monday">Monday</option>
<option value="2" label="Tuesday">Tuesday</option>
<option value="3" label="Wednesday">Wednesday</option>
<option value="4" label="Thursday">Thursday</option>
<option value="5" label="Friday">Friday</option>
<option value="6" label="Saturday">Saturday</option>
<option value="7" label="Sunday">Sunday</option>
</select>
To : <select class="form-control" id="daysTo" ng-model="daysFrom" ng-change="getSubcategoryValue('daysFrom');">
    <option value="" label="Select Day" selected="selected">Select Day</option>
    <option value="1" label="Monday">Monday</option>
    <option value="2" label="Tuesday">Tuesday</option>
    <option value="3" label="Wednesday">Wednesday</option>
    <option value="4" label="Thursday">Thursday</option>
    <option value="5" label="Friday">Friday</option>
    <option value="6" label="Saturday">Saturday</option>
    <option value="7" label="Sunday">Sunday</option>
    </select>

答案 3 :(得分:0)

我没有看到任何角度,所以我展示了如何在纯粹的js中管理它:

&#13;
&#13;
(function(){

//private scope
 
//variables - DOM references
var output=document.querySelector("#output");
var from=document.querySelector("#daysFrom");
var to=document.querySelector("#daysTo");

//error codes
var ERROR_CHOOSE=-1;
var ERROR_DIFF=-2;

//calculates
function calcDiff(){
  
  if (to.value==="" || from.value==="")
  return ERROR_CHOOSE;
  
  if (to.value<from.value)
  return ERROR_DIFF;
  
  return to.value-from.value+1;
  
};

//return human results
function display(){

    var result=calcDiff();

    if (result>0){ //we know no error
      
        if (result==1)
        return result+=" day";
        else
            return result+=" days";
    }

    //here errors

    return result==ERROR_CHOOSE?"Choose both days":"Choose right days";
};


//usage example
from.addEventListener("change",function(){

  output.innerText=display();
  
});

to.addEventListener("change",function(){

  output.innerText=display();
  
});
 
})();
&#13;
<select class="form-control" id="daysFrom" ng-model="daysFrom" ng-change="getSubcategoryValue('daysFrom');">
<option value="" label="Select Day" selected="selected">Select Day</option>
<option value="1" label="Monday">Monday</option>
<option value="2" label="Tuesday">Tuesday</option>
<option value="3" label="Wednesday">Wednesday</option>
<option value="4" label="Thursday">Thursday</option>
<option value="5" label="Friday">Friday</option>
<option value="6" label="Saturday">Saturday</option>
<option value="7" label="Sunday">Sunday</option>
</select>

<select class="form-control" id="daysTo" ng-model="daysFrom" ng-change="getSubcategoryValue('daysFrom');">
<option value="" label="Select Day" selected="selected">Select Day</option>
<option value="1" label="Monday">Monday</option>
<option value="2" label="Tuesday">Tuesday</option>
<option value="3" label="Wednesday">Wednesday</option>
<option value="4" label="Thursday">Thursday</option>
<option value="5" label="Friday">Friday</option>
<option value="6" label="Saturday">Saturday</option>
<option value="7" label="Sunday">Sunday</option>
</select>
<div style="margin-top:10px">Current trip length:
<b id="output">Please choose days</b>
</div>
&#13;
&#13;
&#13;