/ / Data pipe com angular não funcionando como anunciado - angular

Tubo de data com ângulo não funcionando como anunciado - angular

O pipe de data em angular deve funcionar como diz nos documentos: https://angular.io/api/common/DatePipe. No entanto, quando eu corro Today"s date is {{myDate| date:"fullDate"}} está imprimindo A data de hoje é 30/01/2018. E é isso, sem hora, sem fuso horário. Alguém experimentou isso e encontrou uma maneira de fazê-lo funcionar da maneira que deveria?

Editar: não importa a data definida, ela imprime a mesma data.

A data está sendo definida como

getDate(date: string) {
//date = "2018-01-30T00:02:14.637Z";
return new Date(date);
}

Eu tentei dessa maneira e usando essa string diretamente no modelo e o resultado é o mesmo M / D / AAAA

Respostas:

1 para resposta № 1

A documentação sobre https://angular.io/api/common/DatePipe é baseado no lançamento atual, eu acho. Atualmente, estou no @ angular / common 4.2.4 e dei uma olhada no date_pipe.d.ts.

Os formatos "long", "full", "longTime" e "fullTime" estão ausentes.

Portanto, se você não deseja atualizar para o Angular 5, ainda pode "reconstruí-los" combinando os seletores:

*  | Component | Symbol | Narrow | Short Form   | Long Form         | Numeric   | 2-digit   |
*  |-----------|:------:|--------|--------------|-------------------|-----------|-----------|
*  | era       |   G    | G (A)  | GGG (AD)     | GGGG (Anno Domini)| -         | -         |
*  | year      |   y    | -      | -            | -                 | y (2015)  | yy (15)   |
*  | month     |   M    | L (S)  | MMM (Sep)    | MMMM (September)  | M (9)     | MM (09)   |
*  | day       |   d    | -      | -            | -                 | d (3)     | dd (03)   |
*  | weekday   |   E    | E (S)  | EEE (Sun)    | EEEE (Sunday)     | -         | -         |
*  | hour      |   j    | -      | -            | -                 | j (1 PM)  | jj (1 PM) |
*  | hour12    |   h    | -      | -            | -                 | h (1)     | hh (01)   |
*  | hour24    |   H    | -      | -            | -                 | H (13)    | HH (13)   |
*  | minute    |   m    | -      | -            | -                 | m (5)     | mm (05)   |
*  | second    |   s    | -      | -            | -                 | s (9)     | ss (09)   |
*  | timezone  |   z    | -      | -            | z (Pacific Standard Time)| -  | -         |
*  | timezone  |   Z    | -      | Z (GMT-8:00) | -                 | -         | -         |
*  | timezone  |   a    | -      | a (PM)       | -                 | -         | -         |

No meu caso eu usei

{{ dateString | date:""EEEE, MMMM dd, y, hh:mm:ss Z"}}

com saída: "segunda-feira, 9 de abril de 2018, 03:42:00 GMT + 2"

TL; DR - use date: "full" se você estiver no Angular v5 ou superior - crie sua própria sequência de datas se você estiver em uma versão inferior.


1 para resposta № 2

Eu apenas tentei isso e full fornece a data completa. fulldate fornece apenas a data, não a data com a hora e o fuso horário.

Meu HTML

  <div class="panel-heading">
{{pageTitle}} today: {{ today | date: "full"}}
</div>

No meu componente

today: Date = new Date(Date.now());

O resultado é isto:

insira a descrição da imagem aqui

Observe que a data aparece em seu formato completo. (Ignore onde eu o coloquei ... estou apenas usando um dos meus aplicativos de amostra.)