我有一个简单的表单,看起来像这样

<form (ngSubmit)="save()" #documentEditForm="ngForm">
...
</form>

需要从表中输入submit,并从外部判断其validity

要么按程序提交,要么在<form>标签外加<button type="submit">.

推荐答案

了解如何做到这一点:

  • 触发提交<formname>.ngSubmit.emit()
  • 使用<formname>.form.valid获取表单状态

示例:

<form (ngSubmit)="save()" #documentEditForm="ngForm">
...
</form>

<button class="btn-save button primary"
(click)="documentEditForm.ngSubmit.emit()"
[disabled]="!documentEditForm.form.valid">SAVE</button>

编辑:正如@yuriy yakovenko所指出的,您应该在组件代码中添加以下内容:

@ViewChild('documentEditForm') documentEditForm: FormGroupDirective; 

如果你还没有完成,别忘了导入FormGroupDirective

Angular相关问答推荐

如何在自定义验证器中获取所有表单控件(字段组动态创建)

Angular:将服务注入非独立组件导致应用程序中断

首期日历发行

NGNEW不会在src根文件夹ANGLI CLI 17.0.10中生成app.mode.ts

阶段JS画布覆盖 bootstrap 模式

无法绑定到formControl,因为它不是input的已知属性

有角.服务.模块构建失败.无法读取未定义的属性(读取文件)

ngrx 效果等到从初始值以外的其他状态收到响应

Angular 15 Ref 错误:初始化前无法访问组件 A

VSCode / Angular 应用程序未完全启动

如何从表单组中禁用的表单控件中获取值?

在 Angular2 中跟踪 Google Analytics 页面浏览量

为什么我们需要`ngDoCheck`

如何使用 CLI 创建特定版本的 Angular 项目?

angular2中的httpinterceptor类似功能是什么?

Angular 2表单验证重复密码

如何在 Angular 应用程序中通过路由更改页面标题?

如何在 angular2 中的 div 的 contenteditable 上使用 [(ngModel)]?

将 [NgStyle] 与条件组合(if..else)

如何将从后端渲染的参数传递给angular2 bootstrap 方法