title: Angular Reactive Form Submission Event
body: <p>I've built a validation component that works great. However, I'd like to extend it by adding success messages when a form is submitted successfully.</p>
  <p>In the component I pass in the form, watch for changes, and act on the error:</p>
  <pre><code>this.formGroup.valueChanges.pipe(takeUntil(this.ngUnsubscribe)).subscribe(data =&gt; {
      if (this.formGroup.invalid) {
          this.validation = { message: `Check for errors in the form`, valid: false };
      } else {
          this.validation = { message: '', valid: true };
      }
  });
  </code></pre>
  <p>However I can't see a direct way to get a submission event into my component so that I can show success in the ui.</p>
  <ol>
  <li>Can I use the <a href="https://angular.io/guide/reactive-forms#saving-form-data" rel="nofollow noreferrer">(ngSubmit)</a> <a href="https://angular.io/api/forms/NgForm#onsubmit" rel="nofollow noreferrer">event</a> somehow?</li>
  <li>what would you do to get it?</li>
  </ol>
  <p>UPDATE:</p>
  <ol>
  <li><p>After significant time invested into this my <a href="https://github.com/angular/angular/issues/28743" rel="nofollow noreferrer">feature request is here</a></p>
  </li>
  <li><p>Wrote about <a href="https://medium.com/@BenRacicot/success-handling-is-everyones-responsibility-40d844e6cc42" rel="nofollow noreferrer">&quot;success handling&quot; on Medium</a></p>
  </li>
  <li><p>(2022) we finally have the <code>ng-submitted</code> class (v12.1)</p>
  </li>
  </ol>