Я хочу отображать дату в европейском формате, dd/MM/yyyy
но используя формат DatePipe shortDate , он отображается только в американском стиле даты MM/dd/yyyy
.
Я предполагаю, что по умолчанию это en_US. Может быть, мне не хватает документов, но как я могу изменить настройки локали по умолчанию в приложении Angular2? Или, может быть, есть какой-то способ передать пользовательский формат в DatePipe?
138
Ответы:
Начиная с Angular2 RC6, вы можете установить локаль по умолчанию в модуле приложения, добавив провайдера:
Каналы Валюта / Дата / Номер должны подбирать локаль. LOCALE_ID - это OpaqueToken , импортируемый из angular / core.
Для более продвинутого варианта использования вы можете выбрать локаль из службы. Локаль будет разрешена (один раз) при создании компонента с использованием конвейера даты:
Надеюсь, это работает для вас.
источник
new CurrencyPipe('en-US');
. Надеюсь, это будет полезно для чего-то, поскольку это проявилось как первый результат, когда я погуглил мою проблему.Решение с LOCALE_ID отлично подходит, если вы хотите установить язык для своего приложения один раз. Но это не работает, если вы хотите изменить язык во время выполнения. Для этого случая вы можете реализовать пользовательскую трубу даты.
Теперь, если вы измените язык отображения приложения с помощью TranslateService (см. Ngx-translate )
форматы в вашем приложении должны автоматически обновляться.
Пример использования:
или проверьте мой простой проект «Заметки» здесь .
источник
С
angular5
приведенным выше ответом больше не работает!Следующий код:
app.module.ts
Приводит к следующей ошибке:
При этом
angular5
вы должны загрузить и зарегистрировать используемый файл локали самостоятельно.app.module.ts
Документация
источник
registerLocaleData
было достаточно, ну, это не так.Если вы используете
TranslateService
from@ngx-translate/core
, ниже приведена версия без создания нового канала, который работает с динамическим переключением во время выполнения (протестировано на Angular 7). Используяlocale
параметр DatePipe ( docs ):Сначала объявите локали, которые вы используете в своем приложении, например
app.component.ts
:Затем используйте вашу трубу динамически:
myComponent.component.html
myComponent.component.ts
источник
Я заглянул в date_pipe.ts и в нем есть две части информации, которые представляют интерес. рядом с вершиной находятся следующие две строки:
Рядом с дном находится эта строка:
Это наводит меня на мысль о том, что в настоящий момент дата-канал жестко задан как «en-US».
Пожалуйста, просветите меня, если я ошибаюсь.
источник
На app.module.ts добавьте следующий импорт. Существует список опций Locale здесь .
Затем добавьте провайдера
Используйте трубы в HTML. Вот угловая документация для этого.
источник
Вы делаете что-то вроде этого:
{{ dateObj | date:'shortDate' }}
или
{{ dateObj | date:'ddmmy' }}
См .: https://angular.io/docs/ts/latest/api/common/index/DatePipe-pipe.html.
источник
Я боролся с той же проблемой и не работал для меня, используя это
Итак, я попробовал обходной путь, не лучшее решение, но оно сработало:
Я всегда могу создать собственную трубу.
источник
Для тех, у кого проблемы с AOT, вам нужно сделать это немного по-другому с помощью useFactory:
источник
{ provide: LOCALE_ID, useFactory: () => 'fr-CA'}
сделалСкопированный канал Google изменил язык, и он работает для моей страны. Возможно, они не закончили его для всех языков. Ниже приведен код.
источник
Хорошо, я предлагаю это решение, очень простое, используя
ngx-translate
источник
Это может быть немного поздно, но в моем случае (угловой 6) я создал простой канал поверх DatePipe, что-то вроде этого:
Возможно, не лучшее решение, но простое и работает.
источник