angular - 修补 FormGroup 时如何让 Angular Reactive Forms PatchValue() 忽略空值或未定义

Question

对于我正在构建的应用程序，我从 API 检索数据并直接使用该响应设置我的表单值。为此，我正在使用响应式(Reactive)表单模块。我已经构建了表单，以便它与我从 API 获取的对象相匹配。问题是某些字段应该是一个对象 (FormGroup)，但在为空时为 NULL。这会导致错误“无法将未定义或 null 转换为对象”。

FormGroup 实例:

note: this.formBuilder.group({
   turnbook_file: [''],
   note: [''],
   additional_files: ['']
});

API 的响应

note: NULL

我的想法是，也许可以在您定义 FormGroup 的地方放置一个 OR 语句或其他内容，如下所示:

note: this.formBuilder.group({
   turnbook_file: [''],
   note: [''],
   additional_files: ['']
} | NULL);

Answer 1

您可以尝试使用 lodash pickBy 方法在使用前包装您的 api 响应。

import * as _ from 'lodash';
...
//fetch data from API
note.patchValue(
    _.pickBy(apiResponse)
);
...