日期选择器变量

时间:2019-12-02 23:17:12

标签: angular frontend angular-ngmodel angular-daterangepicker

我一直在尝试为我的数据设计一个日期范围过滤器,并做了一个测试功能来将变量更改为开始日期和结束日期。该代码在直接调用时显示正确的日期,但是在打印变量时,它无法正确打印。

Component.html:

<div class="search">
    <input type="text" matInput
    id = 'calander'
    ngxDaterangepickerMd
    [locale]="{ 
      cancelLabel: 'Cancel',
      applyLabel: 'Okay',
      clearLabel: 'Clear',
      format: 'YYYY/MM/DD'
    }"
    startKey="start"
    endKey="end"
    [(ngModel)]="selected"
    name="daterange"
    (ngModelChange)="doSomething($event)"/>
    <button class="ripple" type="submit" ></button>
</div>

Component.ts:

  startDate: Moment;
  endDate: Moment;

  doSomething(event){
    console.log(event) // input value is logged
    alert(event.start); 

    this.startDate = event.start;
    this.endDate = event.end;
    alert('start: ' + this.startDate + '\nend: ' + this.endDate);
 }

1st Alert 2nd Alert

1 个答案:

答案 0 :(得分:0)

在您的情况下,日期值以毫秒的形式分配给其他变量,这就是为什么您看到的日期时间是长整数值。

您必须创建一个新的Date()对象,以获取所需的日期时间格式。

this.startDate = new Date(event.start);
this.endDate = new Date(event.end);

您可以从Date syntax (MDN)获取有关日期格式的帮助。