title: How can I reset a reactive form control to originate state?
body: <p>Hi I need help with a reactive forms element. Basically, it's a required element. When the view first loads, the element is not red(not showing error that it needs a value). That is good and it only will show red if I tap inside then navigate away without filling it out. The logic I currently have is when I fill it out and submit the form... the form data gets submitted but I remain on the same page but all the previous values are wiped out. The issue with that is... now the form element thinks I didn't fill it out and is complaining when it should just not complain because technically it's a new form.</p>
  
  <p>Here's my form group: </p>
  
  <pre><code>this.transactionForm = fb.group({
        'billNumber': [null, Validators.compose([Validators.required, Validators.pattern('^[a-zA-Z0-9\\-_]*$'), Validators.maxLength(30)])],
        'birthdate': [null, Validators.required],
        'transactionDate': [new Date(), Validators.required],
        'type': ['Sales', Validators.required],
      });
  </code></pre>
  
  <p>Currently,  I have a function called reset() that I call when the form is submitted: </p>
  
  <pre><code>reset() {
      this.transactionForm.get('billNumber').setErrors({required: false});
      this.transactionForm.controls['billNumber'].setValue('');
      this.transactionForm.controls['billNumber'].setErrors({'incorrect': false});
      this.transactionForm.controls['billNumber'].markAsUntouched();
      this.transactionForm.controls['billNumber'].markAsPristine();
      this.transactionForm.controls['birthdate'].setValue(null);
      this.transactionForm.controls['birthdate'].markAsUntouched();
      this.transactionForm.controls['birthdate'].markAsPristine();
      this.transactionForm.controls['birthdate'].setErrors({'incorrect': false});
      this.transactionForm.controls['transactionDate'].setValue(new Date());
      this.transactionForm.controls['type'].setValue('Sales');
      this.transactionForm.clearValidators();
    }
  </code></pre>
  
  <p>It's easier to get type and transactionDate to be reset to a default value but I'm not sure what I can do about birthdate or bill Number above. I tried the code above but on reset, the control is still red (and invalid).. which it should be in a new/original state. How can I fix this? </p>