在日期选择器的事件发射器中发射日期对象答案

【问题标题】：Emit Date Object in Event Emitter for Date Picker在日期选择器的事件发射器中发射日期对象
【发布时间】：2019-04-05 19:29:51
【问题描述】：

我有一个自定义的日期选择器子组件，其中 onDateChange 事件，我想向父组件发出事件。

@Output() selectedDateChange = new EventEmitter<Date>();
onDateChange($event) {
    this.selectedDateChange.emit($event); //$event has proper Date Value
}

在父组件中，在我的 html 中有

<app-custom-date (selectedDateChange) = "onSomeTestMethod($event")> </app-custom-date>

在 TS 中

someAttrib: Date;
onSomeTestMethod($event) {
   this.someAttrib = $event; //type of $event is Object but has proper data
}

我在将 $event 类型的对象转换为 Angular 中的 Date 时遇到问题

【问题讨论】：

你什么时候触发 onDataChange 的？？能否分享一下app-customer-data的来源
您能否更详细地描述一下，$event 对象是什么？我的意思是，它的结构、特性。
$event 是日期对象。 onDateChange 在 Date Picker 的 (onChange) 事件上触发

标签： javascript angular datepicker

【解决方案1】：

当我使用日期类型的输入时，我得到了它的值，它是一个字符串，然后我将字符串值解析为日期检查这个例子

客户日期

<input  type="date" #v (change)="onDateChange(v.value)" />

组件

  @Output() selectedDateChange = new EventEmitter<Date>();

  onDateChange(value) {        
    this.selectedDateChange.emit( new Date(value));
  }

app.component

模板

<app-custom-data (selectedDateChange)="log($event)"></app-custom-data>

组件

  log(value){
    console.log(typeof value); // object
    console.log( value instanceof Date); // true value is a date object
    console.log(value)
  }

demo ??

【讨论】：