SQL date field not showing properly in Angular.js

Question

I tried showing MSSQL data in a HTML table using Angular JS ng-repeat. My date column field is shown in detailed with timezone etc:

{"date":"2016-12-11 00:00:00.000000","timezone_type":3,"timezone":"UTC"}

I just want to show the date alone. How to format that?

<tr ng-repeat="bill in allbills | filter : search" >
    <td>{{ $index + 1 }}</td>   
    <td>{{ bill.bill_Date }}</td> 
</tr>

angular has a built-in date filter: docs.angularjs.org/api/ng/filter/date — erewok
– erewok, Commented Dec 11, 2016 at 22:42

Divyanshu Maithani · Accepted Answer · 2016-12-12 05:33:36Z

1

You need to use the date filter:

{{ date_expression | date : format : timezone}}

Your <td> should look something like this to display only date:

<td>{{ bill.bill_Date | date:'yyyy-MM-dd'}}</td>

EDIT

You can also write a custom filter since you are already getting the date in correct format. Check this fiddle with working code:

HTML

<div ng-app="myApp" ng-controller="myCtrl">
  <span>{{ bill.bill_Date.date | date}}</span>
</div>

JS

angular.module('myApp', [])
  .controller('myCtrl', function($scope) {
    $scope.bill = { // from row set
      'bill_Date': {
        "date": "2016-12-11 00:00:00.000000",
        "timezone_type": 3,
        "timezone": "UTC"
      }
    };
  })
  .filter('date', function() {
    return function(input) {
      return input.split(' ')[0];
    }
  });

edited Dec 12, 2016 at 5:33

answered Dec 12, 2016 at 3:37

Divyanshu Maithani

15.1k2 gold badges39 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Srinivasan Over a year ago

i used like this <td>{{ bill.bill_Date | date:'yyyy-MM-dd'}}</td>. but stil it displays with complete format.. remember it comes from SQL Server rowset.. it displays {"date":"2016-12-11 00:00:00.000000","timezone_type":3,"timezone":"UTC"}

Divyanshu Maithani Over a year ago

Do you want to display it as 2016-12-11 ?

Divyanshu Maithani Over a year ago

I've added a custom filter, check it out.

Collectives™ on Stack Overflow

SQL date field not showing properly in Angular.js

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related