angular-ng-bootstrap:实现自定义NgbDateParserFormatter以更改NgbInputDatepicker上的输入值的格式是否正确?

前端之家收集整理的这篇文章主要介绍了angular-ng-bootstrap:实现自定义NgbDateParserFormatter以更改NgbInputDatepicker上的输入值的格式是否正确?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我在弹出窗口中使用datepicker( ng-boostrap),我想将日期格式更改为’dd-mm-yyyy’.

它接缝可以解决实现一个新的NgbDateParserFormatter来替换默认的NgbDateISOParserFormatter.

但我想知道是否有另一种方式.

谢谢,
尼尔森.

更新:

使用moment.js的一个小的实现的NgbDateParserFormatter
(使用ng-bootstrap版本1.0.0-alpha.14进行测试)

import {NgbDateParserFormatter,NgbDateStruct} from '@ng-bootstrap/ng-bootstrap';
import * as moment from 'moment';

export class NgbDateMomentParserFormatter extends NgbDateParserFormatter {
    constructor(private momentFormat: string) {
        super();
    };
    format(date: NgbDateStruct): string {
        if (date === null) {
            return '';
        }
        let d = moment({ year: date.year,month: date.month - 1,date: date.day });
        return d.isValid() ? d.format(this.momentFormat) : '';
    }

    parse(value: string): NgbDateStruct {
        if (!value) {
            return null;
        }
        let d = moment(value,this.momentFormat);
        return d.isValid() ? { year: d.year(),month: d.month() + 1,day: d.date() } : null;
    }
}

在一个模块中,您可以使用工厂包含提供者来指示日期格式作为参数.

---

@NgModule({

  ---

  providers: [
    { 
      provide: NgbDateParserFormatter,useFactory: () => { return new NgbDateMomentParserFormatter("DD-MM-YYYY") } 
    }
  ]

  ---

})
到今天为止,实现一个定制的NgbDateParserFormatter是最好的方法.所以是的,这是一个正确的方法.

在将来,我们可能会对NgbDateParserFormatter进行更复杂的实现,您可以在其中传递所需的格式(例如yyyy-MM-dd).添加功能将取决于用户的兴趣.

您也可以在https://github.com/ng-bootstrap/ng-bootstrap/issues/754#issuecomment-247767027中查看更多背景信息

猜你在找的Angularjs相关文章