要在Angular 9中从子组件提交表单,可以使用以下步骤:
ngForm
指令绑定表单元素:
@Output
装饰器创建一个事件,当表单提交时触发该事件,并将表单数据作为参数传递给父组件:import { Component, Output, EventEmitter } from '@angular/core';
@Component({
selector: 'app-child-component',
template: `
`
})
export class ChildComponent {
formData: any = {};
@Output() formSubmit = new EventEmitter();
onSubmit() {
this.formSubmit.emit(this.formData);
}
}
import { Component } from '@angular/core';
@Component({
selector: 'app-parent-component',
template: `
`
})
export class ParentComponent {
onFormSubmit(formData: any) {
// 在这里处理表单提交事件
console.log(formData);
}
}
当子组件的表单提交时,将会调用父组件中的onFormSubmit
方法,并将表单数据作为参数传递给它。您可以在父组件中处理表单数据,例如将其发送到服务器或进行其他操作。