AngularJS: show time from datetime

Question

I am using Angular in a web application. I am showing some placed orders by users with following code. And this works just fine:

<div class="orderspresent" ng-cloak="">
<div class="roworders" style="margin-bottom:5px;" ng-controller="allorders" >
<div class="col-md-3" ng-repeat= "o in orders | orderBy:-o.orderID" ng-hide= "o.orderStatus=='done'" ng-hide="hidden" ng-class="{fade: startFade}">
<div class="sm-st clearfix">
 <div class="sm-st-info">
     <i class="fa fa-square"></i>
     <input type="checkbox" ng-true-value="{{o.orderID}}" ng-change="stateChanged({{o.orderID}})" ng-model="status"/>
 </div>
 <span>{{o.customerName}}</span>
 <p>{{o.orderDate | date:'h:mm'}}</p>
 <ul>
    <li ng-repeat= "details in o.details">
     {{details.aantal}} x {{details.productTitle}}
     <div ng-if="details.extras">
      +{{details.extras}} 
     </div>
    </li>     
    <p class="totalprice">{{getTotal()}} euro</p>
  </div>
</div>

But for each of these orders I want to show the time they got ordered. I tried using {{o.orderDate | date:'h:mm'}} but this doesn't seem to do anything... How can I only show for example: 10:06 or 12:10?

JSON Data

[{"orderID":49,"customerID":61,"orderDate":"2015-05-06 10:03:05","orderDeliveryDate":"2015-05-06 10:30:05"}, ...]

what format do you get in the orderDate?Can you place that here so we can see what's coming and we can extract the time from it. — Angular Learner
– Angular Learner, Commented May 12, 2015 at 10:12
Maybe the property o.orderDate is not a date. Can you show the output of console.log(o.orderDate, typeof o.orderDate) please? — manzapanza
– manzapanza, Commented May 12, 2015 at 10:14

dfsq · Accepted Answer · 2015-05-12 10:22:03Z

3

Looks like the string you are passing into date filter is not valid ISO 8601 datetime string so the filter can't handle it. The closest to your orderDate strings applicable format would be something like yyyy-MM-ddTHH:mmZ. So you can either make your strings to look like '2015-05-06T10:03:05' or convert them to Date objects before passing to template: new Date('2015-05-06 10:03:05').

Here is a little demo of the difference: http://plnkr.co/edit/t2nk1qS4SMvGPzeSi3eC?p=preview

answered May 12, 2015 at 10:22

dfsq

193k26 gold badges244 silver badges261 bronze badges

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

Collectives™ on Stack Overflow

AngularJS: show time from datetime

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related