AngularJS Datetime format filter in controller

Welcome to the In infinityknow.com website! You will Step By Step learn web programming, easy and very fun. This website allmost provides you with a complete web programming tutorial presented in an easy-to-follow manner. Each web programming tutorial has all the practical examples with web programming script and screenshots available.For AngularJS Datetime format filter in controller

Syntax of Date Filter in AngularJS

{{yourdateexpression | date : format}}

Convert JSON date to JavaScript date in angularjs

Return json

//input - "DocDate":"\/Date(1127318400000-0000)\/"

HTML part

<tr>
	<td>{{user.DocDate | Datefjson}}</td>
</tr>

script.js

app.filter('Datefjson', ['$filter', function ($filter) {
    return function (input, format) {
        return (input) 
               ? $filter('date')(parseInt(input.substr(6)), format) 
               : '';
    };
 }]);
 

app.filter("dateFilter", function ($filter) {
return function (item) {
    if (item != null) {
        var dateparse = new Date(parseInt(item.substr(6)));
		//return like format 'yyyy-MM-dd'
        return $filter('date')(dateparse, 'yyyy-MM-dd');
    }
    return "";
};
});
 

AngularJS Datetime format in view and controller


    <title>AngularJS Datetime format in view and controller</title>


    <a href="http://angular.min.js">http://angular.min.js</a>
    
        var app = angular.module('infinityknow', [])
        app.controller('dfilterCtrl', function ($scope) {
            $scope.todayDate = new Date();
        });
    
    <div>
        <u>dd/MM/yyyy format</u><br /><span>{{todayDate | date:'dd/MM/yyyy'}}</span>
        <hr />
        <u>dd, MMMM yyyy format</u><br /><span>{{todayDate | date:'dd, MMMM yyyy'}}</span>
        <hr />
        <u>24 Hour time</u><br /><span>{{todayDate | date:'HH:mm:ss'}}</span>
        <hr />
        <u>12 Hour time</u><br /><span>{{todayDate | date:'hh:mm:ss a'}}</span>
    </div>



 

Convert JSON date to JavaScript date in angular

syntax
-------
angular.module('Dateinfinityknow', [])
  .controller('DatefjsonController', ['$scope', function($scope) {
    $scope.datajsonsamole = '\/Date(1433913313004-0800)\/';
  }]);
  
Example
-------
  angular.module('Dateinfinityknow', [])
  .filter('Datefjson', ['$filter', function ($filter) {
    return function (input, format) {
        return (input) 
               ? $filter('date')(parseInt(input.substr(6)), format) 
               : '';
    };
 }]);

Angular JSON Date Converter Filter Example steps By Steps



  <title>Angular JSON Date Converter Filter Example steps By Steps</title>
  
  <a href="http://script.js">http://script.js</a>


  <h2>Angular JSON Date Converter Filter Example</h2>
  <div>
    <div>
      Simple Original Data value JSON Date : 
	  <pre>
	  {{datajsonsamole}}
	  </pre>
    </div>
    <h3>AngularJS dates in different formats :</h3>
    <div>{{ datajsonsamole | Datefjson }}</div>
    <div>{{ datajsonsamole | Datefjson : 'yyyy-MM-dd' }}</div>
    <div>{{ datajsonsamole | Datefjson :'medium' }}</div>
    <div>
      {{ datajsonsamole | Datefjson : 'yyyy-MM-dd HH:mm:ss Z' }}
    </div>
  </div>


Example

READ :  Angular Date filtering and formatting JSON Data