Format Date heure en JS angulaire

Question

Comment afficher correctement l'heure de la date dans Angular JS

La sortie ci-dessous montre l'entrée et la sortie (avec / sans filtre de date angulaire)

 In: {{v.Dt}}  
Angular: {{v.Dt | date:'yyyy-MM-dd HH:mm:ss Z'}}
 

impressions:

 In: 2012-10-16T17:57:28.556094Z 
Angular: 2012-10-16T17:57:28.556094Z
 

Le format d'affichage souhaité est 2010-10-28 23:40:23 0400 ou 2010-10-28 23:40:23 EST

Answer 1

Votre code devrait fonctionner comme vous l'avez vu ce violon .

Vous devrez vous assurer que votre v.Dt est un objet Date approprié pour que cela fonctionne bien.

 {{dt | date:'yyyy-MM-dd HH:mm:ss Z'}}
 

ou si dateFormat est défini dans le domaine d'application comme étant dateFormat = 'aaaa-MM-jj HH: mm: ss Z':

 {{dt | date:dateFormat }}
 

Answer 2

v.Dt n'est probablement pas un objet Date ().

Voir http://jsfiddle.net/southerd/xG2t8/

mais dans votre contrôleur:

 scope.v.Dt = Date.parse(scope.v.Dt);
 

Answer 3

Je sais que c'est un vieil article, mais j'ai pensé jeter dans une autre option à envisager.

Que la chaîne d'origine ne comprend pas le "T" demarker, l'implémentation par défaut Angulaire ne pas le reconnaître comme une date. Vous pouvez le forcer à l'aide d'une nouvelle Date, mais c'est un peu de douleur sur un tableau. Puisque vous pouvez pipe ainsi que des filtres, vous pourriez être en mesure d'utiliser un filtre pour convertir votre entrée d'une date et d'appliquer ensuite la date: filtre sur le convertir en jour. Créer un nouveau filtre personnalisé comme suit:

app.
.filter("asDate", function () {
    return function (input) {
        return new Date(input);
    }
});

Ensuite, dans votre balisage, vous pouvez transférer les filtres:

{{item.myDateTimeString | asDate | date:'shortDate'}}

Answer 4

vous pouvez obtenir le 'date' filtre comme ceci:

var today = $filter('date')(new Date(),'yyyy-MM-dd HH:mm:ss Z');

Cela va vous donner la date du jour dans le format que vous souhaitez.

Answer 5

Avez-vous vu la Rédaction de directives (version courte) de la section de la documentation?

HTML

<div ng-controller="Ctrl2">
      Date format: <input ng-model="format"> <hr/>
      Current time is: <span my-current-time="format"></span>
</div> 

JS

function Ctrl2($scope) {
  $scope.format = 'M/d/yy h:mm:ss a';
}