为什么是布尔值在FormRecord可能未定义?

Question

我试图在处理程序方法中进行分配，但this.form.value的类型是Partial<{ [key: string]: boolean }>，编译器告诉我string索引签名不兼容，未定义不能分配给boolean。

我不明白当控件显式地使用非null或未定义的初始值创建时，布尔值如何被认为可能未定义。

如何处理这种类型而不必使用null原谅操作符?(!)

export interface TableColumn {
visible?: boolean;
key: string;
}
...
@Input() public columns: TableColumn[] = [];
public form: FormRecord<FormControl<boolean>>;
constructor(private _fb: FormBuilder) {
this.form = this._fb.nonNullable.record({});
}
public ngOnInit(): void {
this.columns.forEach((col: TableColumn) => {
const control = this._fb.nonNullable.control<boolean>(col.visible ?? true);
this.form.addControl(col.key, control);
})
}
public handler(): void {
const val: Record<string, boolean> = this.form.value;
const value: { [key: string]: boolean } = this.form.value;
}

Answer 1

你可以给它指定它告诉你的类型:

const val: Partial<{[x: string]: boolean}> = this.form.value;

或者干脆不指定类型，让typescript推断出。

const val = this.form.value; // type is Partial<{[x: string]: boolean}>

布尔值可以未定义的原因是，您可以索引非键的字符串。

的例子:

this.form.value["someRandomString"] // undefined

这是使用Partial的优点，它强制您检查此条件。

Answer 2

因为this.form.value是Partial<{ [x: string]: boolean }>，所以您可以使用类型断言:

const val: Record<string, boolean> = this.form.value as Record<string, boolean>;
const value: { [key: string]: boolean } = this.form.value as Record<string, boolean>;

或者，只是让编译器高兴，说布尔值可以是未定义的:

const val: Record<string, boolean | undefined> = this.form.value;
const value: { [key: string]: boolean | undefined } = this.form.value;