Angular 5 - как сделать тип поля периода строчным в DatePipe

Используя DatePipe в Angular 5.1, мне нужно отформатировать тип поля периода (AM/PM) строчными буквами. Согласно документации,

Tuesday, December 19, 7:00 am 

должно быть

date:'EEEE, MMMM d, h:mm a'

Тем не менее, тип поля периода всегда отображается в верхнем регистре, поэтому я вижу это:

Tuesday, December 19, 7:00 AM

Я что-то не так делаю или это известный дефект с форматированием даты в Angular?

5 ответов

Решение

Вы можете просто разделить дату на 2 части:

{{ today | date : 'EEEE, MMMM d, h:mm' }} {{ today | date : 'a' | lowercase }}

...............

ОБНОВИТЬ

Вот еще один простой способ добиться этого, используя встроенный в date pipe и aaaaa matcher (который возвращает строчные a или же p):

<div>{{ today | date : 'EEEE, MMMM d, h:mm aaaaa\'m\'' }}</div>

StackBlitz обновлено: https://stackblitz.com/edit/angular-dcpgzb?file=app%2Fapp.component.html

........

УГЛОВОЕ JS решение

app.controller('MainCtrl', function($scope, $locale) {
  $locale.DATETIME_FORMATS.AMPMS = ['am', 'pm'];
  $scope.today = new Date();
});

https://plnkr.co/edit/a49kjvOdifXPAvBlmXEi?p=preview

Облом. Это все еще в случае с Angular 5.

Я создал пользовательский канал, который применяет преобразование в нижнем регистре к тексту, соответствующему указанному регулярному выражению.

Строчная труба

строчный-match.pipe.ts

import { Pipe, PipeTransform  } from '@angular/core';

@Pipe({
  name: 'lowercaseMatch'
})
export class LowerCaseMatchPipe implements PipeTransform {

  transform (input: any, pattern: any): any {

    if (!this.isString(input)) {
      return input;
    }

    const regexp = pattern instanceof RegExp ? pattern : new RegExp(pattern, 'gi');

    return input.toLowerCase()
    if (input.match(regexp)) {
      return input.toLowerCase()
    }

    return input
  }

  isString(value: any): boolean {
    return typeof value === 'string';
  }
}

использование

Импорт в модуль

import { LowerCaseMatchPipe } from './lowercase-match.pipe';

@NgModule({
  declarations: [
    ...
    LowerCaseMatchPipe
  ],
  ...
})
export class AppModule { }

Показать дату строчными буквами am / pm

{{ today | date : 'EEEE, MMMM d, h:mm a' | lowercaseMatch : 'am|pm' }}

Существует некоторая дискуссия об этом представлении об использовании GitHub для Angular https://github.com/angular/angular.js/issues/8763

Ты можешь использовать lowercase фильтр после даты, чтобы преобразовать am/pm в нижний регистр.

For example: 1343623006 | date:'EEEE, MMMM d, h:mm a' | lowercase

Лучше всего представить следующую форму:

{{сегодня | дата: 'МММ д, г, ч: мм' | Название дела }}

Хочу дополнить ответ Андрея и объединить его в единую интерполяцию

{{ (today | date: 'MMM d, y, h:mm') + (today | date: 'a' | lowercase) }}

У меня возникла проблема, когда между двумя вставками предложения Андрея добавлялся пробел. Это может сработать, если вы этого хотите, но мне нужны строчные буквы без пробелов: например. 21 октября 2020 г., 13:16

Другие вопросы по тегам