Angular 4中的数据绑定与第三方组件

Question

我正在使用第三方，但我相信这不是问题，而是我的代码。

我使用了来自的datepicker：

https://github.com/kekeh/mydatepicker

然后将其打包成指令：

import { IMyDpOptions, IMyMonthLabels, IMyDate, IMyDateRange } from 'mydatepicker';
import { Component, OnInit, Input, EventEmitter, Output, } from '@angular/core';

@Component({
  selector: 'app-datepicker',
  template:
  `<my-date-picker name="mydate"  [(ngModel)]="model" [options]="myDatePickerOptions" (dateChanged)="onDateChanged($event)" ></my-date-picker>`
})
export class DatePicker implements OnInit {

  public model: any;


  @Input('Date') DateString: string;
  @Output('DateChange') DateChange: EventEmitter<string> = new EventEmitter<string>();

  constructor() { }

  ngOnInit() {
        this.model = { date: { year: 1999, month: 12, day: 12 } };
  }


  public myDatePickerOptions: IMyDpOptions = {
    // other options...
    dateFormat: 'dd.mm.yyyy',

  };

  onDateChanged(event: any) {
    let date = event.date.year + "-" + event.date.month + "-" + event.date.day;
    this.DateChange.emit(date);

  }

}

https://angular-y5ephz.stackblitz.io

https://stackblitz.com/edit/angular-y5ephz?file=app%2Fapp.component.html

问题是第二个datepicker不会改变它的值，尽管它的值在getDay方法中被改变了。

问题是，如何强制第二改变其价值......

Answer 1

您的组件正确地将值发送到函数getDay($event)。但在该功能中，您设置两个日期：this.date1 = this.date2 = event;

试试这个：stackblitz