angular - 在 Angular TS 版本 3.8 中为自定义表单验证器绕过 TS1337
问题描述
我正在使用以下模板为 Angular 编写自己的自定义表单验证器。
static customFunction(param: number, param2: string): ValidatorFn {
return (control: AbstractControl): { [key: string]: any } => {
return { customError: {param, param2} };
};
}
而不是key:string
我只想允许定义的枚举中的一系列项目。
export enum FormErrorEnum {
unknown = 'unknown',
customError = 'customError',
}
export type FormError = keyof typeof FormErrorEnum;
如果我尝试使用其中任何一个,[key: FormError]: any
否则[key in FormError]:any
我会得到两个错误之一。
[key: FormError]: any
结果是 TS1337。
[key in FormError]:any
导致返回 (customError: {param,param2}
被拒绝,因为它不包括枚举中的所有整数。
我已经看过这个线程。TS 版本是 3.8 - 升级是一个选项。
解决方案
您可以使用文字类型而不是枚举。
export type FormError = 'unknown' | 'customError';
const error1: FormError = 'unknown'; // ok
const error2: FormError = 'illegal'; // error
您的 customFunction 中的返回类型应该是:
type ErrorResult = {
[P in FormError]?: any;
};
如果您只允许 FormError 的一个属性:
type ErrorResult = {
[P in FormError]: { [K in P]: any };
}[FormError];
这背后的想法是:为每个键创建所需的类型:{ [K in P]: any }
. 将它们放在地图中:{ [P in FormError]: {...} }
. 获取地图的值:[FormError]