web-dev-qa-db-fra.com

AngularJS - convertit les dates dans le contrôleur

Quelqu'un pourrait-il s'il vous plaît me suggérer comment convertir la date de ce format 1387843200000 en ce 24/12/2013 à l'intérieur de mon contrôleur ?

Juste pour information, mes dates sont stockées de cette manière et lorsqu’il s’agit de modifier un formulaire avec le champ input type="date" n’est pas renseigné du tout.

# démo de Plunker ici.

EditCtrl

app.controller("EditCtrl", [ "$scope", "$filter", "db" function ($scope, $filter, db){

    // this gets me an item object
    var item = db.readItem();

    // item date = 1387843200000
    // this returns undefined 
    item.date = $filter('date')(date[ item.date, "dd/MM/yyyy"]);

}]);

Edit.html - template

<form name="editForm" class="form-validate">

        <div class="form-group">
            <label for="date">Event date.</label>
            <input type="date" class="form-control" ng-model="event.date" id="date" required />
        </div>

        <a href="#/" class="btn btn-danger ">Cancel</a>
        <button id="addEvent" class="btn btn-primary pull-right" ng-disabled="isClean() || editForm.$invalid" ng-click="saveEvent()">Save event.</button>

    </form>
angularjsdatedatetimedatetime-formatng-controller
109
Iladarsda
item.date = $filter('date')(item.date, "dd/MM/yyyy"); // for conversion to string

http://docs.angularjs.org/api/ng.filter:date

Mais si vous utilisez HTML5 type = "date", le format ISO aaaa-MM-jj DOIT être utilisé.

item.dateAsString = $filter('date')(item.date, "yyyy-MM-dd");  // for type="date" binding


<input type="date" ng-model="item.dateAsString" value="{{ item.dateAsString }}" pattern="dd/MM/YYYY"/>

http://www.w3.org/TR/html-markup/input.date.html

REMARQUE: l'utilisation de pattern = "" avec le type = "date" n'a pas l'air standard, mais semble fonctionner de la manière attendue dans Chrome 31.

206
Darryl Miles

créez un filter.js et vous pourrez le rendre réutilisable

angular.module('yourmodule').filter('date', function($filter)
{
    return function(input)
    {
        if(input == null){ return ""; }
        var _date = $filter('date')(new Date(input), 'dd/MM/yyyy');
        return _date.toUpperCase();
    };
});

vue

<span>{{ d.time | date }}</span>

ou en contrôleur

var filterdatetime = $filter('date')( yourdate );

Filtrage et formatage de date en Angular js.

16
Prashobh

Toutes les solutions ici ne lient pas vraiment le modèle à l'entrée car vous devrez redéfinir le dateAsString pour qu'il soit enregistré en tant que date dans votre objet (dans le contrôleur une fois le formulaire soumis).

Si vous n'avez pas besoin de l'effet contraignant, mais juste pour le montrer dans l'entrée,

un simple pourrait être:

<input type="date" value="{{ item.date | date: 'yyyy-MM-dd' }}" id="item_date" />

Ensuite, si vous le souhaitez, dans le contrôleur, vous pouvez enregistrer la date modifiée de cette manière:

  $scope.item.date = new Date(document.getElementById('item_date').value).getTime();

attention: dans votre contrôleur, vous devez déclarer votre variable item comme étant $scope.item pour que cela fonctionne.

1
Dudi

je suggère en Javascript:

var item=1387843200000;
var date1=new Date(item);

et puis date1 est une date.

1
BrianPando