如何从 NGX-Bootstrap datepicker 获取自定义日期格式值

Question

我正在为我的 angular6 项目使用 NGX-Bootstrap。我有反应形式并向其添加了日期选择器，同时从日期选择器返回值时获得完整格式，例如：“2018-11-07T05:12:35.000Z”。但我想要 MM-DD-YYYY。

Answer 1

尝试

  <input  bsDatepicker [bsConfig]="{ dateInputFormat: 'MM-DD-YYYY'}" >

Answer 2

在返回日期之前，将日期格式转换如下：

let date = new Date(dateValue).toLocaleDateString();

然后将 date 分配给表单控制器

Answer 3

为了更通用，您可以创建一个指令，其中 returns 以您想要的格式显示日期。例如

<input changeDateFormat type="text" placeholder="Datepicker" class="form-control" #dp="bsDatepicker" bsDatepicker [(bsValue)]="bsValue">

export class changeDateFormatDirective implements OnChanges {
@Input() bsValue: Date;
@Output() bsValueChange = new EventEmitter();

constructor(private cdr: ChangeDetectorRef) { }

ngOnChanges(changes: SimpleChanges) {
//change Date format here, you can import format date from @angular/common
this.bsValueChange.emit(newDateFormat);
this.cdr.detectChanges();
}
}

如何从 NGX-Bootstrap datepicker 获取自定义日期格式值

How to get custom date format value from NGX-Bootstrap datepicker

ngx-bootstrap