web-dev-qa-db-fra.com

AngularJS. Convertir la valeur de la balise (heure Unix en heure lisible par l'homme)

Je reçois des données d'une base de données et les affiche:

    <ul>
       <li ng-repeat="item in items>
          <mydate>{{item.date}}</mydate>
        </li>
    </ul>

Où {{item.date}} est une date Unix telle que 1374843600. Comment définir le format de date à l'aide des directives AngularJS? C'est possible?

Quand j'ai essayé de le faire, je recevais une valeur de tag mydate -{{item.date}}

angularjsangularjs-directive
59
Yaroslav Osetrov

Utiliser le format date filter comme ça:

<mydate>{{item.date * 1000 | date:'yyyy-MM-dd HH:mm:ss Z'}}</mydate>

référence

83
EpokK

J'ai fait face au problème avec l'heure unix formatée avec un nombre de secondes depuis le début de l'époque ou sous la forme d'un nombre de millisecondes utilisé en JavaScript. Ainsi à proprement parler, AngularJS ne convertit pas l’horodatage Unix en Date, mais en un nombre de millisecondes, qui est 1000 fois plus grand. Vous devrez donc tout d'abord multiplier votre nombre entré par 1000, comme ceci:

<mydate>{{item.date * 1000 | date:'yyyy-MM-dd HH:mm:ss Z'}}</mydate>

Sinon, votre date sera fausse.

217
Sergei Basharov

Si vous avez un horodatage Unix, vous devrez probablement multiplier votre horodatage par 1000, car l'horodatage Unix est en secondes et le filtre de date AngularJs nécessite des millisecondes.

vm.milliseconds = Date('1441981121' * 1000);

puis utilisez la fonction $ filter ()

var date = $filter('date')(vm.milliseconds, 'd MMMM yyyy');

ou vous pouvez utiliser dans ng-bind

<span ng-bind="myController.milliseconds | date : 'd MMMM yyyy'"></span>
5
Cyril

Vous devez utiliser le filtre de date déjà fourni par angular: here

3
AlwaysALearner
 yourapp.filter('timestampToDate', function () {
    return function (timestamp) {
        var date = new Date(timestamp * 1000);
        var dateObject = date.getFullYear() +'/'+ ('0' + (date.getMonth() + 1)).slice(-2) +'/'+ ('0' + date.getDate()).slice(-2);
        return dateObject;
    };
});

Usage:
{{timestamp | timestampToDate}}

3
Phong Dao

Il existe une directive à celle appelée rsTime.

    <rs-time start-time="1478513323" digital-format="'ddd MMM d h:mm TT'"></rs-time>

Vérifiez la démo à Plunker .

Vous trouverez ci-dessous différents formats de temps:

 M/d/y -  11/7/2016

 HH:mm:ss - 16:02:31 (24hrs formate)

 hh:mm:ss TT - 04:03:10 PM

 ddd MMM d h:mm TT  - Mon Nov 7 at 4:04 PM

Pour la visite de documentation Github

1
Joshna Gunturu