How to Use a Date Filter in AngularJS

 Use a Date Filter in AngularJS

AngularJS, the “Date” filter formats a text to a given date format change to required format example: 'dd/MM/yyyy' using AngularJs Filter.




<html xmlns="">
<head runat="server">
     <script src = ""></script>

    <script type="text/javascript">

        var myapp = angular.module("MyAppp", []);
        myapp.controller("MyController", function ($scope)

            var cou = [

            {course: "Asp.Net", doj: new Date("November 2012, 24") },
            { course: "Jquery", doj: new Date("December 12, 2014") },
            {course:"JavaScript",doj: new Date("12 January 2000")}


            $scope.Show = function (course)
                $scope.cou = cou;
            $scope.Clear = function (course)
                $scope.cou = '';

<body ng-app="MyAppp">
    <form id="form1" runat="server">
    <div ng-controller="MyController" align="center">

       <input type="button" value="SHOW" style="color:red" ng-click="Show(course)" />
              <input type="button" value="CLEAR" style="color:red" ng-click="Clear(course)" />

            <tr style="color:deeppink"><th>Course Name</th><th>Date of Joining(Formating Date)</th><th>Original Date</th></tr>
            <tr ng-repeat="course in cou">
                                                   <%-- // Required Format--%>
                <td>{{course.doj | date:"dd/MM/yyyy"}}</td>




First add new webform - Add Angularjs controller with table datas with date format

Next - Bind Date format to Table using | (Pipe Symbol) for Filter to date   format  when button click 


Post a Comment