如何悬挂角日期范围选择器反应形式控件

问题描述

我正在处理响应式表单，但是日期范围选择器存在问题，如何设置开始日期和结束日期的表单控件。

<fieldset class="form-group">
  <div [formGroup]="formGroup" class="inputGroup">
      <input class="form-control" placeholder="Click to select a date"  angular-mydatepicker (click)="onClick($event);dp.toggleCalendar()"
      [options]="myOptions" [formControlName]="formCtrl" #dp="angular-mydatepicker" (dateChanged)="onDateChanged($event)"/>
  </div>
</fieldset>

TS文件： 我正在从父组件发送formCtrl和表单组，我需要formGroup的开始和结束日期

@input()
  required: boolean;
  @input()
  label: string;
  @input()
  formCtrl: string;
  @input()
  formGroup: FormGroup;

  @Output()
  dateSelected: EventEmitter<IMyDateModel> = new EventEmitter<IMyDateModel>();

  curDate = new Date();
  isdisabled = false;

  myOptions: IAngularMyDpOptions = {
      daterange: true,dateFormat: 'mm/dd/yyyy',calendaranimation: {in: CalAnimation.FlipDiagonal,out: CalAnimation.Rotate},disableSince: { year: this.curDate.getFullYear(),month: this.curDate.getMonth() + 1,day: this.curDate.getDate() + 1 }
  };

  ngOnInit() {
      let begin: Date = new Date();
      let end: Date = new Date();
      end.setDate(end.getDate() + 3);
      const  model = {
            isRange: true,singleDate: null,daterange: {
              beginDate: {
                year: begin.getFullYear(),month: begin.getMonth() + 1,day: begin.getDate()
              },endDate: {
                year: end.getFullYear(),month: end.getMonth() + 1,day: end.getDate()
              }
            }
          };

      this.formGroup.controls[this.formCtrl].setValue(model);
      this.formGroup.updateValueAndValidity();
  }

  onDateChanged(event: IMyDateModel) {
      this.dateSelected.emit(event);
  }

  onClick(event: any) {
    console.log(event)
      event.srcElement.blur();
      event.preventDefault();
  }

这里我需要单个表单控制器中的日期范围值，有什么解决方法吗？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）