ng-bootstrap datepicker格式 [英] ng-bootstrap datepicker format

查看:117
本文介绍了ng-bootstrap datepicker格式的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用 ng-bootstrap 日期选择器,但是当我保存表单,将日期另存为.

I am using ng-bootstrap datepicker but when I save my form the date gets saved as.

date: {
  day: 01,
  month: 12,
  year: 16
}

我希望可以将其另存为"2016-11-23T00:39:31.768Z"

I was hoping I could get it to save as something more like "2016-11-23T00:39:31.768Z"

这是我的实现方式

<div class="input-group">
  <button class="input-group-btn" (click)="d.toggle()" >
    <md-icon svgSrc="assets/images/calendar-plus.svg" style="cursor: pointer;"></md-icon>
  </button>
  <input class="form-control" placeholder="dd-mm-yyyy" name="dp" formControlName="due_date" navigation="arrows" ngbDatepicker #d="ngbDatepicker">
</div>

和form.component:

And form.component:

constructor( private fb: FormBuilder ) {
    this.form = this.fb.group({
      due_date: [''],
    });
  }

推荐答案

您使用的是ng-bootstrap而不是ng2-bootstrap(不同的组).它后面的代码使用NgbDateStruct,它是对象{ day, month, year }

You're using ng-bootstrap not ng2-bootstrap (different groups). The code behind it uses the NgbDateStruct which is an object { day, month, year }

提交后,您需要挂接并将其值更改为其他值,例如:

On submission you'll need to hook in and change the value to something else, like:

onSubmit(): {
    let ngbDate = this.form.controls['due_date'].value;
    let myDate = new Date(ngbDate.year, ngbDate.month-1, ngbDate.day);
    let formValues = this.form.value;
    formValues['due_date'] = myDate;
    <...>
    http.post(url, formValues);
}

https://ng-bootstrap.github.io/#/components/datepicker

NgbDateStruct NgbDatepicker和 NgbInputDatepicker指令

NgbDateStruct Interface of the model of the NgbDatepicker and NgbInputDatepicker directives

属性

day类型:数字每月的一天,从1开始.

day Type: number The day of month, starting at 1

month类型:数字月份,我们使用ISO 8601(默认日历):1 = Jan ... 12 =十二月

month Type: number The month, with default calendar we use ISO 8601: 1=Jan ... 12=Dec

year类型:数字年份,例如2016

year Type: number The year, for example 2016

这篇关于ng-bootstrap datepicker格式的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆