我有一个父组件,它有一个子组件 .
子组件是用户详细信息页面,他们输入名称等 .
目前,我已将其连接起来,以便表单上的提交按钮具有 (click)
,它使用eventemitter通知他们已提交表单的父组件 . 该模型使用双向绑定,因此父组件可以获取更改 .
由于我没有使用表单提交,因此单击按钮时不会触发模型验证 .
是否有更好的方法涉及使用提交将数据提供给父组件,从而触发表单验证,还是有办法手动激活表单验证,只有在事件有效时才继续触发事件?
用户细节组件:
<h2>User Details</h2>
<label>Name</label> {{userDetailsModel.Name}}<br>
<button (click)="formSubmitted();">Submit</button>
表格提交方式:
@Output()
notification: EventEmitter<string> = new EventEmitter<string>();
formSubmitted() {
this.notification.emit("submit_click");
}
父组件:
<h2>Parent Component</h2>
<app-user-details [user]="user"
(notification)="notificationReceived($event)">
</app-user-details>