2014-07-09 7 views
14

Wie formatiere ich ein Angular-Raster, das Entitäten empfängt, die eine Datumzeiteigenschaft namens startTime und endTime haben, um die Zeit in einem AM/PM-Format anzuzeigen? Im Moment verwende ich:Anzeigen von Zeit im AM/PM-Format mit Winkelraster

und offensichtlich die 'tt' statt AM oder PM zeigt. Hat jemand AM/PM in einem Angular ngGrid gemacht?

Antwort

24

Es ist einfach, dies sehen:

{ field: 'createdOn', displayName: 'Created On', width: '180px', 
cellTemplate: "<div class='ngCellText'>{{row.entity.createdOn | date:'MM/dd/yy h:mm:ss a'}}</div>" }, 

Das ist es

Für weitere Details über die date format see this

3

Musste nur ein paar Dinge zusammenstecken. Zunächst wird ein Filter:

app.filter('ampmtime', 
    function() { 
     return function (value) { 
      if (!value) { return ''; } 
      var hours = new Date(value).getHours(); 
      var minutes = new Date(value).getMinutes(); 
      var ampm = hours >= 12 ? 'PM' : 'AM'; 
      hours = hours % 12; 
      hours = hours ? hours : 12; // the hour '0' should be '12' 
      minutes = minutes < 10 ? '0' + minutes : minutes; 
      var strTime = hours + ':' + minutes + ' ' + ampm; 
      return strTime; 
     } 
    }); 

Dann wird der Aufruf der Funktion auf den gridOptions:

{ field: 'StartTime', displayName: 'Start Time', cellFilter: 'ampmtime'}, 
{field:'EndTime', displayName: 'End Time', cellFilter: 'ampmtime'} 

Und Sie sind alle gesetzt.

2

Gerade das gleiche Problem gefunden und eine einfachere Lösung mit dem Datumsfilter von angular gefunden. Sie müssen nur tt, um einen ändern, wie so

{ field: 'StartTime', displayName: 'Start Time', cellFilter: 'date:\'hh:mm a\''} 

Winkel des refference für die Datumsfilter sehen - https://docs.angularjs.org/api/ng/filter/date