Date filtering and formatting in controller using Angularjs

Date filtering and formatting in controller using Angularjs

In this Post We Will Explain About is Date filtering and formatting in controller using Angularjs With Example and Demo.

Welcome on infinityknow.com – Examples ,The best For Learn web development Tutorials,Demo with Example! Hi Dear Friends here u can know to AngularJS Date Filter function Example: Format Date and Time in controller

In this post we will show you Best way to implement AngularJS Set Custom Date Format Using Date Filter, hear for How to How to apply the date filter in AngularJS with Download .we will give you demo,Source Code and examples for implement Step By Step Good Luck!.

READ :  Best Vuejs Tutorials beginner -learn Vuejs step by step

It is always simple or better to create a angularjs scripts put the filter.js file for those simple date filtering concept. Advantage of this is we can used to very easily filter the all json data anywhere in HTML your view display.

View : AngularJS Datetime format in view and controller
[php]

{{ d.time | date }}

[/php]
Filter.js

Here “date” function using angular from filter.js and then “d.time” is the time some format that we are going to here below code filter ( From your simple controller or view ).

[php]
angular.module(‘liveApp’).filter(‘date’, function($filter)
{
return function(input)
{
if(input == null){ return “”; }

var liveDate = $filter(‘date’)(new Date(input), ‘MMM dd yyyy’);

READ :  Laravel Delete Migration

return liveDate.toUpperCase();

};
});
[/php]

Even we can format some date with some more condition using angular.
[php]
angular.module(‘liveApp’).filter(‘date’, function($filter)
{
return function(input)
{
if(input == null){ return “”; }

if( your condtion )
{
var liveDate = $filter(‘date’)(new Date(input), ‘MMM dd yyyy’);
}
else {
var liveDate = $filter(‘date’)(new Date(input), ‘MM dd yyyy’);
}

return liveDate.toUpperCase();

};
});
[/php]

Time filtering – How to apply the date filter in AngularJS

[php]
angular.module(‘liveApp’).filter(‘time’, function($filter)
{
return function(input)
{
if(input == null){ return “”; }

var liveDate = $filter(‘date’)(new Date(input), ‘HH:mm:ss’);

return liveDate.toUpperCase();

};
});
[/php]

View – How to format date in angularjs
[php]

{{ d.time | time }}

[/php]

Date time filtering

[php]
ngular.module(‘liveApp’).filter(‘datetime’, function($filter)
{
return function(input)
{
if(input == null){ return “”; }

READ :  Vue js Drag and drop multiple file upload with progress bar

var liveDate = $filter(‘date’)(new Date(input),
‘MMM dd yyyy – HH:mm:ss’);
return liveDate.toUpperCase();

};
});
[/php]

View – Date filtering and formatting in Angular js
[php]

{{ d.time | datetime }}

[/php]

Filter the data in controller

[php]
angular.module(‘liveApp’).controller( ‘liveCtrl’,
function ($rootScope, $scope,$filter )
{

var filterdatetime = $filter(‘datetmUTC’)( date );
or
var filterdatetime = $filter(‘datetmUTC’)( $scope.date );

});
[/php]

Example

I hope you have Got AngularJS Date Filter function Example: Format Date and Time in controller And how it works.I would Like to have FeadBack From My Blog(infinityknow.com) readers.Your Valuable FeadBack,Any Question,or any Comments abaout This Article(infinityknow.com) Are Most Always Welcome.

Leave a Reply

Your email address will not be published. Required fields are marked *