嘿,我想在用户手动输入出生日期时添加破折号。 像这样 2019年8月18日 但我无法做到这一点
public dateOfBirth: { year: number; month: number; day: number };
html 文件
<input
ngbDatepicker
dobMask
#d="ngbDatepicker"
#dobF="ngModel"
class="form-control input-underline input-lg"
id="dob"
[(ngModel)]="dateOfBirth"
placeholder="mm-dd-yyyy"
name="dp"
[ngClass]="{
invalid:
(dobF.value === null || isString(dobF.value) || futureDate) && dobF.touched
}"
required
/>
我尝试了指令,但结果是这样的 11---------3
这是我的指令代码
@Directive({
selector: '[dobMask]'
})
export class DobDirective {
@HostListener('input', ['$event'])
onKeyDown(event: KeyboardEvent) {
const input = event.target as HTMLInputElement;
let trimmed = input.value.replace(/\s+/g, '');
if (trimmed.length > 8) {
trimmed = trimmed.substr(0, 8);
}
let numbers = [];
for (let i = 0; i < trimmed.length; i += 2) {
numbers.push(trimmed.substr(i, 2));
}
input.value = numbers.join('-');
}
}
这就是我得到的
我的预期结果是 即2019年8月17日
任何人都可以帮助我如何实现这一目标吗?
最佳答案
稍微修改一下你的指令,它工作正常
import {Directive,HostListener} from '@angular/core'
@Directive({
selector: '[dobMask]'
})
export class DobDirective {
@HostListener('input', ['$event'])
onKeyDown(event: KeyboardEvent) {
const input = event.target as HTMLInputElement;
let trimmed = input.value.replace(/\s+/g, '');
if (trimmed.length > 10) {
trimmed = trimmed.substr(0, 10);
}
trimmed = trimmed.replace(/-/g,'');
let numbers = [];
numbers.push(trimmed.substr(0,2));
if(trimmed.substr(2,2)!=="")
numbers.push(trimmed.substr(2,2));
if(trimmed.substr(4,4)!="")
numbers.push(trimmed.substr(4,4));
input.value = numbers.join('-');
}
}
第一个问题是您正在修剪长度 8 ,它应该是 10 (包括“-”)
然后 for 循环你总是递增 2 ,这不会起作用,因为我们在最后一项中需要 4 个值。
此外,您需要先删除“-”,然后再继续您的逻辑。
检查这个
关于angular - 如何在输入字段中的 2 位数字 Angular 4 之后添加破折号/连字符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55593151/