AngularJs and moment.js not working
Question
I just want to make a short webpage with Angular Js which calculates a date. moment.js is from the page: http://momentjs.com/
This is the current code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Date Calculator</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"> </script>
<script src="moment.js"></script>
</head>
<body>
<script>
function personController($scope) {
moment();
$scope.year = moment().get('year');
$scope.month = moment().get('month');
$scope.day = moment().get('day');
}
</script>
<h1>Date Calculator</h1>
<div ng-app="" ng-controller="personController">
<form action="datecalc.html">
<h2>Startdate</h2>
<table>
<tr><td> <p>Day: <br><input name="day" type="number" size="20" maxlength="20" min="1" max="31" ng-model="day"></p></td>
<td> <p>Month: <br><input name="month" type="number" size="20" maxlength="20" min="1" max="12" ng-model="month"></p></td>
<td> <p>Year: <br><input name="year" type="number" size="20" maxlength="20" min="1980" max="4000" ng-model="year"></p></td>
</tr>
<tr>
<td>
Add/Substract
</td>
<td>Days: </td>
<td>Months: </td>
<td>years: </td>
</tr>
<tr>
<td> <select id = "todo">
<option value = "1">add</option>
<option value = "2">substract</option>
</select>
</td>
<td><input name="days" type="number" size="10" maxlength="100" ng-model="days"></td>
<td><input name="months" type="number" size="10" maxlength="100" ng-model="months"></td>
<td><input name="years" type="number" size="10" maxlength="100" ng-model="years"></td>
</tr>
</table>
</form>
</div>
</body>
</html>
When the page is loaded, the fields day, month and year should be set to the current date.
Any idea why this is not working?
best regards
1 answers
solution1
0 2015-02-02 20:54:55
I'll make this a proper answer.
Although this is a very bad way to do angular, and you should not get in the habit of doing it this way, the angular parts are working fine. The issue is moment.
I don't know moment too well but you don't even need it in this case. You can use the javascript date object. Like so...
var d = new Date();
$scope.year = d.getFullYear();
$scope.month = d.getMonth();
$scope.day = d.getDate();
Should also note, when using getMonth(), it returns the month as an index of an array, so January = 0, Feb = 1, with December being 11.
Edit: So quickly looking, moment does the same thing, and they also do the same thing with 'day'. Day was giving you 1, which is the second index of the array, which would be the 2nd day, which is correct. using
moment().get('date');
instead, gives you the actual day, then just add + 1 to the month result.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.