var app = angular.module('plunker', []);
app.controller('MainCtrl', ["$scope", "$filter",
function($scope, $filter) {
$scope.setDate = function()
{
$scope.inputdate = new Date("October 13, 2014 11:13:00");
$scope.inputdate1 = new Date(99,5,24,11,33,30,0);
$scope.inputdate2 = new Date("1994-11-16T01:00:00");
$scope.inputdate3 = new Date(99,5,24,11,33,30,0);
$scope.inputdate4 = new Date(99,5,24,11,33,30,0);
};
}]);
app.directive('myDirective', ["$filter",
function($filter) {
return {
// $parsers/$formatters live on the
// ngModel controller, so we need this!
require: 'ngModel',
link: function(scope, elem, attrs, ngModel) {
ngModel.$formatters.push(function(value) {
if (angular.isDate(value)) {
value = $filter('date')(value, ['yyyy', 'MM', 'dd']);
}
return value;
});
}
};
}]);
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css" />
<script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.16/angular.js" data-semver="1.3.16"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<div>Formatter: do something to format user input
to be more "human-friendly"</div>
<br/>
<input type="button" value="SET DATE" ng-click="setDate()"/><br/>
new Date("October 13, 2014 11:13:00"); <input my-directive ng-model="inputdate" /><br/>
new Date(99,5,24,11,33,30,0); <input my-directive ng-model="inputdate1" /><br/>
new Date("1994-11-16T01:00:00"); <input my-directive ng-model="inputdate2" /><br/>
</body>
</html>
/* Put your css in here */
body {
font-family: sans-serif;
font-size: 24px;
}