如何从 ionic-2 日历 onchange() 方法中获取选定日期

Question

我正在使用 ion2-calendar。

这是我的 html:

 <ion-calendar [(ngModel)]="date"
              (onChange)="onChange($event)"
              [type]="type"
              [format]="'YYYY-MM-DD'">
</ion-calendar>

这是 ts 中的 onchange:

onChange($event) {

      console.log("onchange event called");
      console.log(moment().format('DD-MM-YYYY'));  
    }

这是我的控制台：

onSelect event called
25-06-2018

但无论我选择哪个日期，我总是得到当前的月份和年份。只有日期值在变化。它在控制台中显示所有日期的当前月份和年份。谁能告诉我如何从 $event 对象中获取 dd-mm-yy 格式的选定日期。

编辑-这就是我得到的 console.log($event)

Moment {_isAMomentObject: true, _i: 1530297000000, _isUTC: false, _pf: {…}, _locale: Locale, …}
_d
:
Sat Jun 30 2018 00:00:00 GMT+0530 (India Standard Time) {}
_i
:
1530297000000
_isAMomentObject
:
true
_isUTC
:
false
_isValid
:
true
_locale
:
Locale {_calendar: {…}, _longDateFormat: {…}, _invalidDate: "Invalid date", ordinal: ƒ, _dayOfMonthOrdinalParse: /\d{1,2}(th|st|nd|rd)/, …}
_pf
:
{empty: false, unusedTokens: Array(0), unusedInput: Array(0), overflow: -2, charsLeftOver: 0, …}
__proto__
:
Object

它显示了正确的点击日期。如果有人能告诉我如何从中提取日期，那就太好了。

Answer 1

moment() 语句总是生成 当前时间 就像 new Date().

你应该使用类似 moment("1995-12-25") 的语句或其他各种语句。

详情请看这里moment.js docs

更新

先说结论，

.html（没有变化）

<ion-content padding>
  <ion-calendar [(ngModel)]="date"
  (onChange)="onChange($event)"
  [type]="type"
  [format]="'YYYY-MM-DD'">
</ion-calendar>

.ts

onChange(event) {
  console.log(event.format('DD-MM-YYYY')); // For actual usage.
  console.log(moment(event).format('DD-MM-YYYY')); // the statement you might think about
}

上面的代码给了你你想要的。

我想说的是，你不应该使用moment()，而是moment(event)。因为 moment() returns 时刻实例 具有 当前时间 而 moment(event) returns 有时间event携带的时刻实例。

Answer 2

OnChange() 的

$event 是矩对象。

你可以这样格式化：$event.format('DD-MM-YYYY')

Answer 3

似乎 Release Candidate 版本将输出事件更改为 change 而不是 onChange 和 select 而不是 onSelect。试试这个：

<ion-calendar [(ngModel)]="date" (change)="onChange($event)" [格式]="'YYYY-MM-DD'"> `

Answer 4

<ion-calendar [(ngModel)]="date" (change)="onChange($event)"  [type]="type" 
   [format]="'YYYY-MM-DD'">
</ion-calendar>
    
date;
type: "string";
onChange(event) {
    console.log(moment(this.date._d).format("YYYY-MM-DD"));
}

如何从 ionic-2 日历 onchange() 方法中获取选定日期

How to get selected date from ionic-2 calendar onchange() method

momentjs

ionic-framework

ionic2

ionic3

angular-calendar