ngx-bootstrap中的datepicker实现本地化,国际化
来源:互联网 发布:桌面整理软件下载 编辑:程序博客网 时间:2024/06/14 04:32
在用Angular4框架开发中引入了ngx-bootstrap,使用了时间控件DATEPICKER,但是遇到的问题是它们显示的是英文字母,但我们想要的是中文字体
如开发文档中显示的图如下:
要实现本地化并不难,需要添加如下代码:
文档介绍:
You can do this with "moment.js", like this :
date = moment(new Date()).format("DD/MM/YYYY");
If you want change language of datepicker :
import 'moment/locale/fr'; [...] ngOnInit() { moment.locale('fr'); }
You can put what you want.
实现代码:
import 'moment/locale/zh-cn';
import * as moment from 'moment';
ngOnInit(): void {
moment.locale('zh-cn');
}
其中“zh-cn”代表中文。
这边提供一个链接:http://momentjs.cn/ 感兴趣的同学可以去了解下moment.js
月份选择:
效果是不是挺赞。
贴上一段代码:
<datepicker class="date-dropdown {{showStartDatepicker ? 'show' : 'hide'}}" [minDate]="minStartDate" [maxDate]="maxStartDate" [showWeeks]="false" //这边掩藏最左边的周数 [startingDay]="1" //这边是日期最左边的开始天数,1表示从星期一开始,0表示从星期天开始 (selectionDone)="onStartDateDone($event)"></datepicker>
特别注意:遇到了一个问题 因为我们是多人开发 在其中一个同事上加入同样的代码,但是运行起来的时候发现并没有实现本地化,而我们其余同事运行起来都有本地化的效果,然后找出了问题,是因为Moment.js版本的问题,具体解决是重新npm install下,删除了cache。不需要修改代码
希望能帮到你们,喜欢的话点个赞吧!!!
- ngx-bootstrap中的datepicker实现本地化,国际化
- bootstrap-datepicker 国际化
- 利用ngx-angular实现angular2的国际化
- Struts2 本地化/国际化实现
- 国际化和本地化中的使用
- ResourceBundle实现本地化和国际化
- C#本地化国际化解决方案实现简介
- 在Linux程序中实现国际化/本地化
- IOS 实现界面本地化(国际化)
- iOS如何实现国际化(本地化)
- C#本地化国际化解决方案实现简介
- 国际化 本地化
- 国际化 本地化
- Swift中的本地化实现
- bootstrap-datepicker
- ngx-bootstrap解析(一)
- iOS本地化国际化(续):不更随系统,手动选择APP语言 本地化和国际化的实现
- Ngx中的红黑树描述
- 地震当晚,淘宝店主突然收到陌生留言:“请给我报个平安”
- css实现横纵向滚动
- 处理从GitHub下载工程到Android Studio遇到的问题
- 深入理解拉格朗日乘子法(Lagrange Multiplier) 和KKT条件
- linux安装多个jdk版本并切换
- ngx-bootstrap中的datepicker实现本地化,国际化
- 赢在面试之Java泛型篇
- jq获取图片宽高
- 1.1输入子系统
- 决策树学习笔记(二)
- linux centos7.3 安装mysql5.7.14
- Nginx
- MYSQL EXPLAIN详解
- HDU 6098-Inversion