Question

我有一个网页表格，可以记录出生日期。我使用ngx-bootstrap版本：2.0.2 datepicker模块执行此操作。我有一个API，只接受MM-dd-yyyy格式的日期值。我的挑战是塑造这个日期值，以便我可以将它发送到API。

这是我到目前为止所尝试的内容：

使用bsConfig，如下所示：

  ngOnInit() {
    this.bsConfig = {
      containerClass: 'theme-red',
      dateInputFormat: 'MM-dd-yyyy'
    };
}

这是我的html输入：

<input class="form-control" 
        type="text" bsDatepicker 
        [bsConfig]="bsConfig" 
        placeholder="Date of Birth" 
        [(bsValue)]="participant.dob" value="{{ participant.dob | date:'yyyy-MM-dd' }}"
        name="dob" 
        [(ngModel)]="participant.dob" 
        #dob="ngModel">

当我从datepicker中选择日期时，我将日期视为我在ngOnInit中设置的格式。但是，实际日期值为{ "dob": "2018-06-07T16:53:52.000Z" }。这是我发送给API的日期。因此，它不起作用。如上所述，我需要发送给API的日期格式必须是MM-dd-yyyy格式。

如何设置此捕获的日期格式，以便将此值发送到我的API？

Answer 1

在将日期发送到API之前，请使用formatDate()对其进行转换。

不要忘记导入它：import { formatDate } from '@angular/common';

constructor(@Inject(LOCALE_ID) private locale: string) {}
myDate;
bsConfig;

ngOnInit() {
  this.bsConfig = {
    containerClass: 'theme-red',
    dateInputFormat: 'MM-dd-yyyy'
  };
}

sendDataToApi() {
  const date = formatDate(this.myDate, this.bsConfig.dateInputFormat, this.locale);
  howeverImSendingDataToApi(whateverData, date);
}

使用ngx-datepicker更改[（ngModel）]上的日期格式

1 个答案: