angular 区不太活跃 故移动此区
因不可抗力原因要求使用 angular20 开始学这个,然后有个问题很困扰 ,就是一般每个表单都会有个对应的 model 页面上会用 formControlName 。 然后我们的 model 字段很多 在 component 里就有很多这种代码
const tubeData: TubeModel = {
commonParams: this.commonParams,
tubeInitDate: formatDate(formValue.tubeInitDate, 'yyyy/MM/dd HH:mm'),
tubeInsertionDate: formatDate(formValue.tubeInsertionDate, 'yyyy/MM/dd HH:mm'),
anticipatedTubeRemovalDate: formatDate(formValue.anticipatedTubeRemovalDate, 'yyyy/MM/dd'),
tubeId: formValue.tubeId,
tubeName: formValue.tubeName,
tubeGroup: formValue.tubeGroup,
tubeType: formValue.tubeType,
tubeMaterial: formValue.tubeMaterial,
tubeProductNumber: formValue.tubeProductNumber,
tubeProductNumberOtherValue: formValue.tubeProductNumber || '',
innerLength: formValue.innerLength,
innerUnit: 'cm',
bodyPosition: formValue.bodyPosition,
bodyPart: formValue.bodyPart,
tubeLength: formValue.tubeLength,
tubeUnit: 'cm',
seqNumber: formValue.seqNumber === '其他' ? formValue.seqNumberOther : formValue.seqNumber,
drainage: formValue.drainage || 0,
traits: {
color: formValue.color,
colorOther: formValue.colorOther || '',
nature: formValue.nature,
natureOther: formValue.natureOther || '',
flavor: formValue.flavor,
flavorOther: formValue.flavorOther || '',
},
};
以及这种
this.form.patchValue({
tubeGroup: tube.tubeGroup,
tubeId: tube.tubeId,
tubeInitDate: tube.tubeInitDate ? new Date(tube.tubeInitDate) : null,
tubeInsertionDate: tube.tubeInsertionDate ? new Date(tube.tubeInsertionDate) : null,
anticipatedTubeRemovalDate: tube.anticipatedTubeRemovalDate
? new Date(tube.anticipatedTubeRemovalDate)
: null,
tubeName: tube.tubeName,
tubeType: tube.tubeType,
tubeMaterial: tube.tubeMaterial,
tubeProductNumber: tube.tubeProductNumber,
innerLength: tube.innerLength,
bodyPosition: tube.bodyPosition,
bodyPart: tube.bodyPart,
tubeLength: tube.tubeLength,
seqNumber: tube.seqNumber,
drainage: tube.drainage,
});
还有 init 的时候这种
ngOnInit(): void {
this.form = this.fb.group({
tubeGroup: [null],
tubeId: [null],
tubeInitDate: [null],
tubeInsertionDate: [null],
anticipatedTubeRemovalDate: [null],
tubeName: [null],
tubeType: [''],
tubeMaterial: [null],
tubeProductNumber: [null],
innerLength: [null],
bodyPosition: [null],
bodyPart: [''],
tubeLength: [null],
seqNumber: [null],
seqNumberOther: [''],
drainage: [null],
color: [null],
colorOther: [''],
flavor: [null],
flavorOther: [''],
nature: [null],
natureOther: [''],
});
}
我觉得看着很冗余 字段多了一刷一大片 既然有了 model ,有办法简化这部分吗