如何知道 Angular (v5) Reactive-Form 是否是从表单字段提交的，而表单字段本身就是一个自定义组件？

Question

我们有一个 Angular 4 应用程序，其中有一个模板驱动的表单，它由多个自定义组件（即我们的自定义输入标签）组成。 在这些自定义组件中，我们需要知道表单是否已经提交。 所以我们可以在组件中显示一些错误文本。 所以我们自定义组件中的这个逻辑直到现在一直适用于 Angular 4 和模板驱动表单：

const classes = this.elementRef.nativeElement.className;

例如，类有 ng-dirty、ng-touched、ng-invalid 和 submit（提交表单时）。 因此，当提交表单时，angular 会为每个表单字段自动添加“提交”类。

现在我们尝试使用响应式形式构建另一个 Angular 应用程序，版本 5。 我们有相同的概念，但从组件（实际上来自 html - 因为我们使用 nativeElement）我们不知何故没有得到任何关于提交的线索。 我们当然可以将表单中的信息提供给自定义元素，但我们不想在每个表单组件上都编写相同的内容。 想象一下，表单有 50 个字段。

还有其他选择吗？

Answer 1

没有这样的属性可以告诉您表单是否已提交，您需要创建一个变量并保持表单的状态，例如

isSubmitted: boolean = false;

关于保存方法

save(...){
   this.isSubmitted = true;
   ...............
}

请参阅以下链接了解更多详情

angular 5 表单验证最简单的方法