Formato Data e hora no AngularJS

Como exibir corretamente a data e a hora no AngularJS?

A saída abaixo mostra a entrada e a saída, com e sem o filtro de data AngularJS:

In: {{v.Dt}}  
AngularJS: {{v.Dt | date:'yyyy-MM-dd HH:mm:ss Z'}}

Isso imprime:

In: 2012-10-16T17:57:28.556094Z 
AngularJS: 2012-10-16T17:57:28.556094Z

O formato de exibição desejado é 2010-10-28 23:40:23 0400ou2010-10-28 23:40:23 EST

v.Dt provavelmente não é um objeto Date ().

Veja http://jsfiddle.net/southerd/xG2t8/

mas no seu controlador:

scope.v.Dt = Date.parse(scope.v.Dt);

Seu código deve funcionar como você vê neste violino .

Você precisará se certificar de que v.Dté um objeto Date adequado para que ele funcione.

{{dt | date:'yyyy-MM-dd HH:mm:ss Z'}}

ou se dateFormat estiver definido no escopo como dateFormat = 'aaaa-MM-dd HH: mm: ss Z':

{{dt | date:dateFormat }}

Eu sei que este é um item antigo, mas pensei em lançar outra opção a considerar.

Como a cadeia original não inclui o demarcador "T", a implementação padrão no Angular não a reconhece como uma data. Você pode forçá-lo usando a nova data, mas isso é um pouco trabalhoso em uma matriz. Como você pode canalizar os filtros juntos, você poderá usar um filtro para converter sua entrada em uma data e depois aplicar a data: filter na data convertida. Crie um novo filtro personalizado da seguinte maneira:

app
.filter("asDate", function () {
    return function (input) {
        return new Date(input);
    }
});

Em sua marcação, você pode canalizar os filtros juntos:

{{item.myDateTimeString | asDate | date:'shortDate'}}

você pode obter o filtro 'date' assim:

var today = $filter('date')(new Date(),'yyyy-MM-dd HH:mm:ss Z');

Isso fornecerá a data de hoje no formato desejado.

Aqui está um filtro que usará uma string de data OU objeto javascript Date (). Ele usa Moment.js e pode aplicar qualquer função de transformação Moment.js , como a popular 'fromNow'

angular.module('myModule').filter('moment', function () {
  return function (input, momentFn /*, param1, param2, ...param n */) {
    var args = Array.prototype.slice.call(arguments, 2),
        momentObj = moment(input);
    return momentObj[momentFn].apply(momentObj, args);
  };
});

Assim...

{{ anyDateObjectOrString | moment: 'format': 'MMM DD, YYYY' }}

seria exibido em 11 de novembro de 2014

{{ anyDateObjectOrString | moment: 'fromNow' }}

seria exibido 10 minutos atrás

Se você precisar chamar várias funções de momento, poderá encadeá-las. Isso converte para UTC e depois formata ...

{{ someDate | moment: 'utc' | moment: 'format': 'MMM DD, YYYY' }}

https://gist.github.com/cmmartin/341b017194bac09ffa1a

Aqui estão alguns exemplos populares:

<div>{{myDate | date:'M/d/yyyy'}}</div> 04/07/2014

<div>{{myDate | date:'yyyy-MM-dd'}}</div> 04/07/2014

<div>{{myDate | date:'M/d/yyyy HH:mm:ss'}}</div> 04/07/2014 12:01:59

Você já viu a seção Diretrizes de escrita (versão curta) da documentação ?

HTML

<div ng-controller="Ctrl2">
      Date format: <input ng-model="format"> <hr/>
      Current time is: <span my-current-time="format"></span>
</div> 

JS

function Ctrl2($scope) {
  $scope.format = 'M/d/yy h:mm:ss a';
}

Dentro de um controlador, o formato pode ser filtrado injetando $ filter.

var date = $filter('date')(new Date(),'MMM dd, yyyy');

Simplificando, se você deseja exibir como "30 de janeiro de 2017 às 16:31:20", siga a etapa simples

Etapa 1 - Declarar a seguinte variável no controlador js

$scope.current_time = new Date();

step2- exibir na página html como

{{current_time | data: 'médio'}}

podemos formatar a data no lado da vista em angular é muito fácil .... por favor, verifique o exemplo abaixo:

{{dt | data: "dd-MM-aaaa"}}

Você pode usar momentjspara implementar o filtro de data e hora no angularjs. Por exemplo:

angular.module('myApp')
 .filter('formatDateTime', function ($filter) {
    return function (date, format) {
        if (date) {
            return moment(Number(date)).format(format || "DD/MM/YYYY h:mm A");
        }
        else
            return "";
    };
});

Onde a data está no formato de carimbo de data / hora.

Adicione $filterdependência no controlador.

var formatted_datetime = $filter('date')(variable_Containing_time,'yyyy-MM-dd HH:mm:ss Z')

Eu sugiro que você use o moment.js, ele tem um bom suporte para a formatação de datas de acordo com as localidades.

crie um filtro que use internamente o método moment.js para formatar a data.