我正在使用 ngx-bootstrap datepicker 如果我输入一个数字，它会自动格式化

Question

我正在使用引导日期选择器，如果我输入一个数字，它会自动格式化（强制解析）。

那么，我如何在引导日期选择器中设置错误的“强制解析”。如果我给出四位数字或五位数字（11111），当焦点移出时，其自动格式如“11/11/0001”。所以我想禁用强制解析。

如果我给出两位数也可以接受并制作这样的格式。

<div class="col-md-8 col-sm-12 box">
    <div class="datepicker" style="display:inline-block;position:relative;">
            <input style="width: 312px;" class="changebg" 
            [maxDate]="maxDate"
            id="dateOfBirth"
            [(ngModel)]="user.dob"
            name="dob"
            #dob="ngModel"
            #dpYMD="bsDatepicker"
            bsDatepicker
            [bsConfig]="{ dateInputFormat: 'YYYY-MM-DD' }"
            required>
            <div [hidden]="dob.valid || dob.pristine" class="alert text-danger">
                <div [hidden]="!dob.hasError('required')">DOB is required</div>
            </div> 
    </div>
</div>

Answer 1

此时没有办法为bsDatepicker设置严格的日期解析。

我所做的解决方法是监听输入更改事件并记住用户输入的最后一个有效日期。然后在输入上

(change)="onChange($event)"

我使用最后一个有效日期值手动重置输入的formControl值。

@HostListener('input', ['$event.target.value', '$event'])
onInput(value: string, event: any): void {
    if (this.dateInputFormat) {
        const parsedDate = moment(value, this.dateInputFormat, true);
        if (parsedDate.isValid()) {
            this.lastValidDateValue = parsedDate.toDate();
        } else {
            this.lastValidDateValue = null;
        }
    }
}

onChange(event: Event): void {
    const target = (event.target as HTMLInputElement);
    if(this.lastValidDateValue) {
        const parsedDate = moment(this.lastValidDateValue).format(this.dateInputFormat);
        this.dateValue = this.lastValidDateValue;
        target.value = parsedDate;
        this.formControl.patchValue(this.dateValue);
    } else {
        target.value = undefined;
        this.dateValue = null;
        this.formControl.patchValue(null);
    }
    
    this.formValidators && this.formControl.setValidators(this.formValidators);
    this.formControl.updateValueAndValidity(); 
}