如何全局配置Ionic中ion-datetime的月份、日期名称？

方案1：Ionic 6 及以上版本（官方推荐） #

Ionic 6 开始组件本地化已和全局配置绑定，可直接通过以下两种方式实现：

• 初始化时全局配置（在 app.module.ts 中设置）

import { IonicModule } from '@ionic/angular';

@NgModule({
  imports: [
    IonicModule.forRoot({
      // 直接指定locale会自动适配对应语言的月份、星期名称，比如zh-CN为简体中文
      locale: 'zh-CN',
      // 需自定义名称的话可添加datetimeOptions配置
      datetimeOptions: {
        monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
        monthShortNames: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
        dayNames: ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'],
        dayShortNames: ['周日', '周一', '周二', '周三', '周四', '周五', '周六']
      }
    })
  ]
})
export class AppModule {}

• 运行时动态修改配置

import { Config } from '@ionic/angular';

constructor(private config: Config) {}

updateDatetimeText() {
  const customMonths = ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'];
  const customWeekdays = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
  
  this.config.set('datetimeOptions', {
    monthNames: customMonths,
    dayNames: customWeekdays
  });
}

方案2：Ionic 4/5 版本适配 #

这两个版本没有直接的全局配置项，可通过依赖注入覆盖默认参数实现：

// 在 app.module.ts 的 providers 数组中添加
import { DATETIME_PICKER_OPTIONS } from '@ionic/angular';

providers: [
  {
    provide: DATETIME_PICKER_OPTIONS,
    useValue: {
      monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
      dayNames: ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
    }
  }
]

注意：如果配置不生效，检查单个 ion-datetime 组件是否单独设置了 locale 属性，单独设置的优先级高于全局配置。

内容的提问来源于stack exchange，提问作者Angular Dev