Cómo formatear la fecha en angularjs

Quiero formatear la fecha como mm/dd/yyyy. Intenté lo siguiente y nada de eso me funciona. Puede alguien ayudarme con esto?

referencia: ui-date

<input ui-date ui-date-format="mm/dd/yyyy" ng-model="valueofdate" /> 

<input type="date" ng-model="valueofdate" />

Angular.js tiene un filtro de fecha incorporado.

manifestación

// in your controller:
$scope.date = '20140313T00:00:00';

// in your view, date property, filtered with date filter and format 'MM/dd/yyyy'
<p ng-bind="date | date:'MM/dd/yyyy'"></p>

// produces
03/13/2014

Puede ver los formatos de fecha admitidos en la fuente del filtro de fecha .

editar :

Si está tratando de obtener el formato correcto en el selector de fecha (no está claro si está usando el selector de fecha o simplemente está tratando de usar su formateador), esas cadenas de formato compatibles están aquí: https://api.jqueryui.com/datepicker/

Si no tiene un campo de entrada, solo desea mostrar una fecha de cadena con un formato adecuado, simplemente puede elegir:

<label ng-bind="formatDate(date) |  date:'MM/dd/yyyy'"></label>

y en el uso del archivo js:

    // @Function
    // Description  : Triggered while displaying expiry date
    $scope.formatDate = function(date){
          var dateOut = new Date(date);
          return dateOut;
    };

Esto convertirá la fecha en cadena en un nuevo objeto de fecha en JavaScript y mostrará la fecha en formato MM / dd / aaaa.

Salida: 15/12/2014

Editar
Si está usando una fecha de cadena con el formato de cadena "2014-12-19 20:00:00" (pasado de un backend de PHP), entonces debe modificar el código en el siguiente: https://stackoverflow.com / a / 27616348/1904479

Agregar más
desde javascript puede configurar el código como:

$scope.eqpCustFields[i].Value = $filter('date')(new Date(dateValue),'yyyy-MM-dd');

en caso de que ya tenga una fecha, de lo contrario puede usar el siguiente código para obtener la fecha actual del sistema:

$scope.eqpCustFields[i].Value = $filter('date')(new Date(),'yyyy-MM-dd');

Para obtener más detalles sobre los formatos de fecha, consulte: https://docs.angularjs.org/api/ng/filter/date

Estoy usando esto y está funcionando bien.

{{1288323623006 | date:'medium'}}: Oct 29, 2010 9:10:23 AM
{{1288323623006 | date:'yyyy-MM-dd HH:mm:ss Z'}}: 2010-10-29 09:10:23 +0530
{{1288323623006 | date:'MM/dd/yyyy @ h:mma'}}: 10/29/2010 @ 9:10AM
{{1288323623006 | date:"MM/dd/yyyy 'at' h:mma"}}: 10/29/2010 at 9:10AM

Esto no es exactamente lo que está pidiendo, pero podría intentar crear un campo de entrada de fecha en html como:

<input type="date" ng-model="myDate" />

Luego, para imprimir esto en la página que usaría:

<span ng-bind="convertToDate(myDate) | date:'medium'"></span>

Finalmente, en mi controlador, declaró un método que crea una fecha a partir del valor de entrada (que en Chrome aparentemente se analiza 1 día libre):

$scope.convertToDate = function (stringDate){
  var dateOut = new Date(stringDate);
  dateOut.setDate(dateOut.getDate() + 1);
  return dateOut;
};

Entonces ahí lo tienes. Para ver cómo funciona todo, vea el siguiente plunker: http://plnkr.co/edit/8MVoXNaIDW59kQnfpaWW?p=preview . ¡Mucha suerte!

Esto funcionará:

{{ oD.OrderDate.replace('/Date(','').replace(')/','') | date:"MM/dd/yyyy" }}

NOTA: una vez que los reemplace, la fecha / millis restante se convertirá en la forma dada.

ver dateAPI angular : API AngularJS: fecha

Uso:

{{ date_expression | date  [: 'format']  [: 'timezone' ] }}

Exampe:

Código:

 <span>{{ '1288323623006' | date:'MM/dd/yyyy' }}</span>

Resultado:

10/29/2010

Yo uso filtro

.filter('toDate', function() {
  return function(items) {
    return new Date(items);
  };
});

luego

{{'2018-05-06 09:04:13' | toDate | date:'dd/MM/yyyy hh:mm'}}

Simplemente pase el formato de fecha UTC del código del lado del servidor al lado del cliente

y use la siguiente sintaxis:

 {{dateUTCField  +'Z' | date : 'mm/dd/yyyy'}}

 e.g. dateUTCField = '2018-01-09T10:02:32.273' then it display like 01/09/2018

Después de mirar todas las soluciones anteriores, la siguiente fue la solución más rápida para mí. Si está utilizando material angular:

 <md-datepicker ng-model="member.reg_date" md-placeholder="Enter date"></md-datepicker>

Para configurar el formato:

app.config(function($mdDateLocaleProvider) {
    $mdDateLocaleProvider.formatDate = function(date) {
        // Requires Moment.js OR enter your own formatting code here....
        return moment(date).format('DD-MM-YYYY');
    };
});

Editar: También debe configurar parseDate para escribir una fecha (a partir de esta respuesta Cambiar el formato de md-datepicker en Material angular )

$mdDateLocaleProvider.parseDate = function(dateString) {
    var m = moment(dateString, 'DD/MM/YYYY', true);
    return m.isValid() ? m.toDate() : new Date(NaN);
};

var app=angular.module('myApp',[]);
        app.controller('myController',function($scope){         
              $scope.names = ['1288323623006','1388323623006'];

        });

Aquí el nombre del controlador es "myController" y el nombre de la aplicación es "myApp".

<div ng-app="myApp" ng-controller="myController">
        <ul>
            <li ng-repeat="x in names">
                {{x | date:'mm-dd-yyyy'}}

            </li>

        </ul>
    </div>

El resultado se verá así: - * 29-10-2010 * 03-03-2013

Ok, el problema parece provenir de esta línea:
https://github.com/angular-ui/ui-date/blob/master/src/date.js#L106 .

En realidad, esta línea es el enlace con jQuery UI, que debería ser el lugar para inyectar el formato de datos.

Como puede ver, var optsno hay ninguna propiedad dateFormatcon el valor de ng-date-format como podría imaginar.

De todos modos, la directiva tiene una constante llamada uiDateConfigpara agregar propiedades opts.

La solución flexible (recomendada):

Desde aquí puede ver que puede insertar algunas opciones inyectando en la directiva una variable de controlador con las opciones de jquery ui.

<input ui-date="dateOptions" ui-date-format="mm/dd/yyyy" ng-model="valueofdate" />

myAppModule.controller('MyController', function($scope) {
    $scope.dateOptions = {
        dateFormat: "dd-M-yy"
    };
});

La solución codificada:

Si no desea repetir este procedimiento todo el tiempo, cambie el valor de uiDateConfigin date.js a:

.constant('uiDateConfig', { dateFormat: "dd-M-yy" })

Tuve el mismo problema y, como los comentarios anteriores, pensé que debía haber un método nativo en JavaScript. La cosa es new Date(valueofdate)devuelve un objeto Date.

Pero, consulte http://www.w3schools.com/js/js_date_formats.asp , la parte que dice cero a la izquierda. Una fecha de una cadena, por ejemplo, un eco de PHP, debe ser como:

$valueofdate = date('Y-n-j',strtotime('theStringFromQuery'));

Esto pasará una Cadena, por ejemplo: '1999-3-3'y JavaScript analizará un objeto con el formato correcto con

$scope.valueofdate = new Date(valueofdate);

<input ui-date ui-date-format="mm/dd/yyyy" ng-model="valueofdate" />
<input type="date" ng-model="valueofdate" />

Enlace a PHP para formatos de fecha: http://www.w3schools.com/php/func_date_date_format.asp .

ng-bind="reviewData.dateValue.replace('/Date(','').replace(')/','') | date:'MM/dd/yyyy'"

Use esto debería funcionar bien. :) Los campos reviewData y dateValue pueden modificarse según su parámetro, el resto puede dejarse igual

{{convertToDate  | date :  dateformat}}                                             
$rootScope.dateFormat = 'MM/dd/yyyy';

// $scope.dateField="value" in ctrl
<div ng-bind="dateField | date:'MM/dd/yyyy'"></div>