Jquery 使用angular4中的mydatepicker在输入框中设置日期

Jquery 使用angular4中的mydatepicker在输入框中设置日期,jquery,angular,angular-forms,Jquery,Angular,Angular Forms,我正在使用mydatepicker显示日期现在我想在输入框中为此设置日期我正在使用该代码:- <my-date-picker formControlName="myDate" [(ngModel)]="task.taskDateFormatted" [options]="myDatePickerOptionsinput" (calendarToggle)="onCalendarToggle($event)" (dateChanged)="onDateChanged($event

我正在使用mydatepicker显示日期现在我想在输入框中为此设置日期我正在使用该代码:-

    <my-date-picker  formControlName="myDate" [(ngModel)]="task.taskDateFormatted" [options]="myDatePickerOptionsinput" (calendarToggle)="onCalendarToggle($event)"  (dateChanged)="onDateChanged($event,task._id)" >
    </my-date-picker> 
我使用这种语法在输入框中设置日期。我正在使用这个日期选择器

这是错误消息:-

错误:ExpressionChangedTerrithasBeenCheckedError:表达式在检查后已更改。以前的值:“2019年1月17日”。当前值:“2019年1月16日” 这是截图:-

谢谢

Html代码:

<p>
  application-detail works!
</p>

<form [formGroup]="myForm" novalidate>
  <my-date-picker id="input-zero"  [options]="myDatePickerOptions" formControlName="myDateZero" (dateChanged)="onDateChanged($event)">
  </my-date-picker>
  <my-date-picker id="input-one" [options]="myDatePickerOptions" formControlName="myDateOne" (dateChanged)="onDateChanged($event)">
  </my-date-picker>
  <my-date-picker id="input-two" [options]="myDatePickerOptions" formControlName="myDateTwo" (dateChanged)="onDateChanged($event)">
  </my-date-picker>
  <my-date-picker id="input-three" [options]="myDatePickerOptions" formControlName="myDateThree" (dateChanged)="onDateChanged($event)">
  </my-date-picker>
  <my-date-picker id="input-four" [options]="myDatePickerOptions" formControlName="myDateFour" (dateChanged)="onDateChanged($event)">
  </my-date-picker>
</form>

你好,曼吉塔。你能发布你的html和js代码吗?@AbhijeetChakravorty从这里你可以查看我的html文件codehttps://jsfiddle.net/dfo1e0t4/I 请看一看。@AbhijeetChakravorty这是我们从中获得应用程序任务的服务器端代码。我相信您需要动态模型。当前,所有的都具有相同的ngModel,除非“task.taskDateFormatted”具有所有不同的值。所有的价值观都是动态的吗?
<p>
  application-detail works!
</p>

<form [formGroup]="myForm" novalidate>
  <my-date-picker id="input-zero"  [options]="myDatePickerOptions" formControlName="myDateZero" (dateChanged)="onDateChanged($event)">
  </my-date-picker>
  <my-date-picker id="input-one" [options]="myDatePickerOptions" formControlName="myDateOne" (dateChanged)="onDateChanged($event)">
  </my-date-picker>
  <my-date-picker id="input-two" [options]="myDatePickerOptions" formControlName="myDateTwo" (dateChanged)="onDateChanged($event)">
  </my-date-picker>
  <my-date-picker id="input-three" [options]="myDatePickerOptions" formControlName="myDateThree" (dateChanged)="onDateChanged($event)">
  </my-date-picker>
  <my-date-picker id="input-four" [options]="myDatePickerOptions" formControlName="myDateFour" (dateChanged)="onDateChanged($event)">
  </my-date-picker>
</form>
import {
        Component,
        OnInit
} from '@angular/core';

import {
        IMyOptions
} from 'mydatepicker';

import {
    FormGroup,
    FormBuilder,
    Validators
} from '@angular/forms';

@Component({
        selector: 'app-application-detail',
        templateUrl: './application-detail.component.html',
        styleUrls: ['./application-detail.component.css']
})
export class ApplicationDetailComponent implements OnInit {
        private checkData: Object;
        private myForm: FormGroup;
        private myDatePickerOptions: IMyOptions = {
                // other options...
                dateFormat: 'dd.mm.yyyy',
        };

        constructor(private formBuilder: FormBuilder) {}

        ngOnInit() {
            this.checkData = {
                a: new Date(),
                b: new Date(),
                c: new Date(),
                d: new Date(),
                e: new Date()
            }
                this.myForm = this.formBuilder.group({
                        myDateZero: ['', Validators.required],
                        myDateOne: ['', Validators.required],
                        myDateTwo: ['', Validators.required],
                        myDateThree: ['', Validators.required],
                        myDateFour: ['', Validators.required]
                        // other controls are here...
                });
        }

        onDateChanged(ev) {
                // You will be able to check the changed dates here.
            console.log(ev);
        }

        setDate(): void {
                // Set today date using the setValue function
                let date = new Date();
                this.myForm.setValue({
                        myDateOne: {
                                date: {
                                        year: date.getFullYear(),
                                        month: date.getMonth() + 1,
                                        day: date.getDate()
                                }
                        }
                });
        }

        clearDate(): void {
                // Clear the date using the setValue function
                this.myForm.setValue({
                        myDate: ''
                });
        }
}