如何在Angular 2中设置DatePipe的区域设置？
我想显示date使用欧洲格式dd/mm/yyyy但使用DatePipe shortDate格式它只显示使用美国date样式mm/dd/yyyy 。
我假设默认语言环境是en_US。 也许我在文档中缺less，但我怎样才能更改在Angular2应用程序的默认区域设置？ 或者也许有一种方法将自定义格式传递给DatePipe？
从Angular2 RC6开始，你可以通过添加一个提供程序来在应用程序模块中设置默认的语言环境：
@NgModule({ providers: [ { provide: LOCALE_ID, useValue: "en-US" }, //replace "en-US" with your locale //otherProviders... ] })
货币/date/号码pipe道应该select区域设置。 LOCALE_ID是从angular度/核心导入的OpaqueToken 。
import { LOCALE_ID } from '@angular/core';
对于更高级的用例，您可能希望从服务中获取语言环境。 使用datepipe道创build组件时，区域设置将被parsing（一次）：
{ provide: LOCALE_ID, deps: [SettingsService], //some service handling global settings useFactory: (settingsService) => settingsService.getLanguage() //returns locale string }
希望对你有效。
我看了一下date_pipe.ts，它有两个有趣的信息位。 靠近顶部的是以下两行：
// TODO: move to a global configurable location along with other i18n components. var defaultLocale: string = 'en-US';
靠近底部是这条线：
return DateFormatter.format(value, defaultLocale, pattern);
这表明datepipe道目前被硬编码为“en-US”。
如果我错了，请赐教。
如果您想为您的应用设置一次语言，那么使用LOCALE_ID的解决scheme非常棒。 但是，如果您想在运行时更改语言，则不起作用。 对于这种情况，你可以实现自定义datepipe道。
import { DatePipe } from '@angular/common'; import { Pipe, PipeTransform } from '@angular/core'; import { TranslateService } from '@ngx-translate/core'; @Pipe({ name: 'localizedDate', pure: false }) export class LocalizedDatePipe implements PipeTransform { constructor(private translateService: TranslateService) { } transform(value: any, pattern: string = 'mediumDate'): any { const datePipe: DatePipe = new DatePipe(this.translateService.currentLang); return datePipe.transform(value, pattern); } }
现在，如果您使用TranslateService更改应用显示语言（请参阅ngx-translate ）
this.translateService.use('en');
应用程序中的格式应该会自动更新。
使用示例：
<p>{{ 'note.created-at' | translate:{date: note.createdAt | localizedDate} }}</p> <p>{{ 'note.updated-at' | translate:{date: note.updatedAt | localizedDate:'fullDate'} }}</p>
或者在这里查看我简单的“Notes”项目。
我正在努力解决同样的问题，并没有为我使用这个工作
{{dateObj | date:'ydM'}}
所以，我试过一个解决方法，而不是最好的解决scheme，但它的工作：
{{dateObj | date:'d'}}/{{dateObj | date:'M'}}/{{dateObj | date:'y'}}
我总是可以创build一个自定义pipe道。
你做这样的事情：
{{ dateObj | date:'shortDate' }}
要么
{{ dateObj | date:'ddmmy' }}
请参阅： https ： //angular.io/docs/ts/latest/api/common/index/DatePipe-pipe.html
复制谷歌pipe改变了语言环境，它适用于我的国家，这是可能的，他们没有完成所有的语言环境。 下面是代码。
import { isDate, isNumber, isPresent, Date, DateWrapper, CONST, isBlank, FunctionWrapper } from 'angular2/src/facade/lang'; import {DateFormatter} from 'angular2/src/facade/intl'; import {PipeTransform, WrappedValue, Pipe, Injectable} from 'angular2/core'; import {StringMapWrapper, ListWrapper} from 'angular2/src/facade/collection'; var defaultLocale: string = 'hr'; @CONST() @Pipe({ name: 'mydate', pure: true }) @Injectable() export class DatetimeTempPipe implements PipeTransform { /** @internal */ static _ALIASES: { [key: string]: String } = { 'medium': 'yMMMdjms', 'short': 'yMdjm', 'fullDate': 'yMMMMEEEEd', 'longDate': 'yMMMMd', 'mediumDate': 'yMMMd', 'shortDate': 'yMd', 'mediumTime': 'jms', 'shortTime': 'jm' }; transform(value: any, args: any[]): string { if (isBlank(value)) return null; if (!this.supports(value)) { console.log("DOES NOT SUPPORT THIS DUEYE ERROR"); } var pattern: string = isPresent(args) && args.length > 0 ? args[0] : 'mediumDate'; if (isNumber(value)) { value = DateWrapper.fromMillis(value); } if (StringMapWrapper.contains(DatetimeTempPipe._ALIASES, pattern)) { pattern = <string>StringMapWrapper.get(DatetimeTempPipe._ALIASES, pattern); } return DateFormatter.format(value, defaultLocale, pattern); } supports(obj: any): boolean { return isDate(obj) || isNumber(obj); } }
对于那些有AOT问题的人，你需要用一个useFactory做一点点改变：
export function getCulture() { return 'fr-CA'; } @NgModule({ providers: [ { provide: LOCALE_ID, useFactory: getCulture }, //otherProviders... ] })
