Como formatar a data em angularjs

Quero formatar a data como mm/dd/yyyy. Eu tentei o seguinte e nada disso funciona para mim. Alguém pode me ajudar com isso?

referência: ui-date

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

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

O Angular.js possui um filtro de data interno.

demonstração

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

Você pode ver os formatos de data suportados na fonte para o filtro de data .

editar :

Se você está tentando obter o formato correto no datepicker (não está claro se você está usando o datepicker ou apenas tentando usá-lo), essas cadeias de formato suportadas estão aqui: https://api.jqueryui.com/datepicker/

Se você não possui um campo de entrada, apenas deseja exibir uma data de sequência com uma formatação adequada, basta acessar:

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

e no arquivo js, ​​use:

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

Isso converterá a data na cadeia de caracteres em um novo objeto de data em javascript e exibirá a data no formato MM / dd / aaaa.

Saída: 15/12/2014

Editar
Se você estiver usando uma data de cadeia com o formato "2014-12-19 20:00:00" (passado de um back-end do PHP), modifique o código para aquele em: https://stackoverflow.com / a / 27616348/1904479

Adicionando mais No
javascript, você pode definir o código como:

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

caso você já tenha uma data com você, você pode usar o seguinte código para obter a data atual do sistema:

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

Para obter mais detalhes sobre os formatos de data, consulte: https://docs.angularjs.org/api/ng/filter/date

Estou usando isso e está funcionando bem.

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

Isso não é exatamente o que você está solicitando - mas você pode tentar criar um campo de entrada de data em html, algo como:

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

Em seguida, para imprimir isso na página que você usaria:

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

Finalmente, no meu controlador, declarei um método que cria uma data a partir do valor de entrada (que no chrome aparentemente é analisado 1 dia de folga):

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

Então aí está. Para ver a coisa toda funcionando, veja o seguinte plunker: http://plnkr.co/edit/8MVoXNaIDW59kQnfpaWW?p=preview. Boa sorte!

Isso funcionará:

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

NOTA: depois de substituí-los, a data / milésimo restante será convertida em um forame.

consulte dateAPI angular : API AngularJS: date

Uso:

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

Exampe:

Código:

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

Resultado:

10/29/2010

Eu uso filtro

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

então

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

Basta passar o formato de data UTC do código do servidor para o cliente

e use a sintaxe abaixo -

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

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

Depois de analisar todas as soluções acima, a seguinte foi a solução mais rápida para mim. Se você estiver usando material angular:

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

Para definir o 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: você também precisa definir o parseDate para digitar uma data (a partir desta resposta Alterar formato de md-datepicker em 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'];

        });

Aqui, o nome do controlador é "myController" e o nome do aplicativo é "myApp".

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

            </li>

        </ul>
    </div>

O resultado será semelhante a: - * 10-29-2010 * 01-03-2013

Ok, o problema parece vir desta linha:
https://github.com/angular-ui/ui-date/blob/master/src/date.js#L106 .

Na verdade, esta linha é a ligação com a jQuery UI, que deve ser o local para injetar o formato dos dados.

Como você pode ver, var optsnão há propriedade dateFormatcom o valor de ng-date-format como você pode ver.

De qualquer forma, a diretiva tem uma constante chamada uiDateConfigpara adicionar propriedades opts.

A solução flexível (recomendada):

A partir daqui, você pode ver que pode inserir algumas opções injetando na diretiva uma variável de controlador com as opções 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"
    };
});

A solução codificada:

Se você não quiser repetir esse procedimento o tempo todo, altere o valor de uiDateConfigdate.js para:

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

Eu tive o mesmo problema e, como os comentários acima, pensei que deveria haver um método nativo em JavaScript. A coisa é new Date(valueofdate)retorna um objeto Date.

Mas verifique http://www.w3schools.com/js/js_date_formats.asp , a parte que diz zero à esquerda. Uma data de uma String, por exemplo, um eco do PHP, deve ser como:

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

Isso passará uma String, por exemplo: '1999-3-3'e o JavaScript fará a análise de um objeto no formato correto com

$scope.valueofdate = new Date(valueofdate);

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

Link para PHP para formatos de data: http://www.w3schools.com/php/func_date_date_format.asp .

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

Use isso deve funcionar bem. :) Os campos reviewData e dateValue podem ser alterados conforme seu restante do parâmetro pode ser deixado o mesmo

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

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