<!DOCTYPE html>
<html>

<head>
     <meta charset="utf-8" />
     <title>AngularJS code-sample</title>
     <link rel="stylesheet" href="style.css" />
     <script src="http://code.angularjs.org/1.2.14/angular.js"></script>
     <script>
          var app = angular.module('myApp', []);
          app.controller('myController', function($scope) {
               $scope.date = new Date();
          });
     </script>
</head>

<body ng-app="myApp" ng-controller="myController">
     <h3>AngularJs date format as given below.</h3>
     
     <p class="col" ng-bind="date | date:'MM-dd-yyyy'"></p>
     <p class="col" ng-bind="date | date:'MM/dd/yyyy'"></p>
     <p class="col" ng-bind="date | date:'MMM d, y h:mm:ss a'"></p>
     <p class="col" ng-bind="date | date:'M/d/yy h:mm a'"></p>
     <p class="col" ng-bind="date | date:'EEEE, MMMM d, y'"></p>
     <p class="col" ng-bind="date | date:'MMMM d, y'"></p>
     <p class="col" ng-bind="date | date:'MMM d, y'"></p>
     <p class="col" ng-bind="date | date:'M/d/yy'"></p>
     <p class="col" ng-bind="date | date:'h:mm:ss a'"></p>
     <p class="col" ng-bind="date | date:'h:mm a'"></p>
     <p class="col" ng-bind="date | date:'yyyy-MM-ddTHH:mm:ss.sssZ'"></p>
     <p class="col" ng-bind="date | date:'MM/dd/yyyy @ h:mma'"></p>
</body>

</html>
// Code goes here

/* Styles go here */

p.col {
     color: green;
}