我只想在编辑时从我的表单发送编辑/更改的值。
目前,我的表单发送所有表单值。
我正在使用接口(interface):
export interface WorkExperience {
id?: number;
name_company:string;
date_start:string;
date_end:string;
}
export interface WorkExperienceUpdate {
id_work_experience: number;
experience: WorkExperience;
}
我在我的 .ts 上这样做:
经验:工作经验;
this.experience = this.navParams.get('experience');
this.registrationForm = formBuilder.group({
company: [this.experience.name_company, Validators.required],
date_start: [this.formatDate(this.experience.date_start), Validators.required],
date_end: [this.experience.date_end ? this.formatDate(this.experience.date_end) : '']
});
我的 html 是:
<form [formGroup]="registrationForm">
<ion-item>
<ion-label floating>Company</ion-label>
<ion-input type="text" formControlName="company"></ion-input>
</ion-item>
<ion-label floating>Start Date</ion-label>
<ion-datetime displayFormat="DD-MM-YYYY" formControlName="date_start"></ion-datetime>
</ion-item>
<ion-item>
<ion-label floating>End Date</ion-label>
<ion-datetime displayFormat="DD-MM-YYYY" formControlName="date_end"></ion-datetime>
</ion-item>
</form>
我使用了相同的表单来添加和编辑,所以当我编辑时我只需要发送不相同的元素,就像这样:
- 如果只编辑结束日期,对象应该是:
{
“id_educative_experience”:8,
“教育经验”:{
"date_end": "30-10-2017"
}
现在用我的方式发送所有值。
我的提交是:
submitRegistration(value): void {
// EDIT
let tempExp;
tempExp = {
date_start: this.formatDate(value['date_start']),
date_end: value['date_end'] ? this.formatDate(value['date_end']) : null,
name_company: value['company'],
}
let updateExperience: WorkExperienceUpdate = {
experience: tempExp,
id_work_experience: this.experience.id,
};
this._wp.updateWorkExperience(updateExperience).subscribe(r => {
this.presentToast(`La experiencia laboral se ha modficado`);
this.nav.pop().then(() => this.presentToast(`La experiencia laboral se ha modficado`));
}, error => {
this.nav.pop().then(() => {
this.presentToast(`Ups, ha ocurrido un error.Inténtalo de nuevo`);
});
})
}
我怎样才能做到只发送编辑过的值
提前致谢
最佳答案
您可以检查表单的脏值。
getDirtyValues(cg: FormGroup) {
const dirtyValues = {};
Object.keys(cg.controls).forEach(c => {
const currentControl = cg.get(c);
if (currentControl.dirty) {
dirtyValues[c] = currentControl.value;
}
});
return dirtyValues;
}
关于angular - 编辑时如何仅以 angular 2+ react 形式发送编辑/更改的字段?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53081731/