Expression has changed after it was checked. Previous value: 'undefined'. Current value: '1399/05/06'.

[azizkhani]

@Component({
    selector: 'op-date-picker',
    template:
            `
        <input type="text" [(ngModel)]="value" class="form-control form-control-c" #datepickerInput/>
        <div class="datepicker-container">
            <ng-persian-datepicker
                    [input]="datepickerInput"
                    [uiTheme]="'default'"
                    [timeMeridian]="true"
                    [dateFormat]="'jYYYY/jMM/jDD'"
            >
            </ng-persian-datepicker>
        </div>

    `,
    providers: [
        {
            provide: NG_VALUE_ACCESSOR,
            useExisting: forwardRef(() => DatePickerComponent),
            multi: true,
        }
    ],
    styles: [':host {  display: block; }']
})
export class DatePickerComponent extends AbstractValueAccessor implements AfterViewInit {

    @Input() placeholder = '';

    constructor(private cdr: ChangeDetectorRef) {
        super();
    }

    ngAfterViewInit() {
        this.cdr.detectChanges();
    }


}



export abstract class AbstractValueAccessor implements ControlValueAccessor {
    _value: any = '';
    get value(): any {
        return this._value;
    };

    set value(v: any) {
        if (v !== this._value) {
            this._value = v;
            this.onChange(v);
        }
    }

    writeValue(value: any) {
        this._value = value;
        // warning: comment below if only want to emit on user intervention
        this.onChange(value);
    }

    onChange = (_) => {};
    onTouched = () => {};

    registerOnChange(fn: (_: any) => void): void {
        this.onChange = fn;
    }

    registerOnTouched(fn: () => void): void {
        this.onTouched = fn;
    }
}

core.js:4196 ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'undefined'. Current value: '1399/05/06'.
    at throwErrorIfNoChangesMode (core.js:5466)
    at bindingUpdated (core.js:13111)
    at Module.ɵɵproperty (core.js:13906)
    at CartableComponent_Template (cartable.component.html:64)
    at executeTemplate (core.js:7446)
    at refreshView (core.js:7315)
    at refreshComponent (core.js:8453)
    at refreshChildComponents (core.js:7108)
    at refreshView (core.js:7365)
    at refreshEmbeddedViews (core.js:8407)

[SaeedDev94]

https://stackblitz.com/edit/angular-ivy-dj2rs8