AngularJS - convertir fechas en controlador

114

¿Alguien podría sugerirme cómo convertir la fecha de este 1387843200000formato a este 24/12/2013 dentro de mi controlador ?

Solo para su información, mis fechas se almacenan de esta manera y cuando el enlace para editar el formulario con el input type="date"campo no se completa en absoluto.

Demostración de #Plunker aquí.

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 - plantilla

<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>
Iladarsda
fuente
1
¿Por qué necesita convertir en el controlador? Puede usar el filtro de fecha para formatear la fecha en su vista si solo necesita un valor que se pueda mostrar.
Justin Niessner
@JustinNiessner - mis fechas se almacenan de esta manera y cuando no se completa el enlace para editar el formulario con el input type="date"campo
Iladarsda
1
Puede usar el filtro de fecha y hora de moment.js angularjs - github.com/urish/angular-moment
virender

Respuestas:

212
item.date = $filter('date')(item.date, "dd/MM/yyyy"); // for conversion to string

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

Pero si está usando HTML5 type = "date", DEBE usar el formato ISO aaaa-MM-dd.

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

NOTA: el uso de pattern = "" con type = "date" parece no estándar, pero parece funcionar de la forma esperada en Chrome 31.

Darryl Miles
fuente
Hola, intenté implementar como se sugirió, pero no funciona para mí.
Mukun
Hola, intenté implementar como se sugirió, pero no funciona para mí. mi respuesta del servicio web de primavera es {"basicPersonalInfo": {"empNo": "04005001", "dob": 490645800000}, "communicationInfo": null}, necesito mostrarlo en mi campo de entrada de fecha bootstrap / HTML5. Usé el filtro en mi controlador como $ scope.basicInfo = BasicInformationService.query (); $ scope.basicInfo. $ promise.then (function (data) {$ scope.basicInfo.basicPersonalInfo.dob = $ filter ('fecha') (data.basicPersonalInfo.dob, "aaaa-MM-dd");}); se agradece cualquier ayuda
Mukun
1
ok, cambié el formato en mi controlador de esta manera y parece funcionar, no estoy seguro de si es la forma correcta. $ scope.basicInfo.basicPersonalInfo.dob = nueva fecha ($ filter ('fecha') (data.basicPersonalInfo.dob, "aaaa-MM-dd"));
Mukun
Mi fecha viene así de API DateTime: "2017/12/15" pero haciendo esto {{M.DateTime | fecha: 'dd-MM-aaaa'}} no cambia el formato de fecha. ¿Cómo lo formateo dentro de la expresión?
Vishal Singh
16

crea un filter.js y puedes hacerlo como reutilizable

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();
    };
});

ver

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

o en controlador

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

Filtrado y formateo de fechas en Angular js.

Prashobh
fuente
1
Parece que ya hay un filtro de fecha integrado en AngularJS: docs.angularjs.org/api/ng/filter/date
AlikElzin-kilaka
1

Todas las soluciones aquí realmente no vinculan el modelo a la entrada porque tendrá que volver a cambiar para dateAsStringque se guarden como dateen su objeto (en el controlador después de que se envíe el formulario).

Si no necesita el efecto de enlace, sino solo para mostrarlo en la entrada,

un simple podría ser:

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

Luego, si lo desea, en el controlador, puede guardar la fecha editada de esta manera:

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

tenga en cuenta: en su controlador, debe declarar su itemvariable $scope.itempara que esto funcione.

Dudi
fuente
1

sugiero en Javascript:

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

y luego date1 es una fecha.

Brian Pando
fuente
Sí, tienes razón donde queremos convertir nuestra marca de tiempo a la fecha
macha devendher