I was thinking of doing a simple form with reactive forms.
The problem I think I'm going to have is when I have two buttons on the form which will need different validation.
For Example, Andy submits a request to Bobby. Bobby then gets to approve the request by clicking approve, or reject the request by clicking reject.
however... reject would require a comments field to be filled in. What is the best way to go about this without adding more fields to the form?
Also its got to be dynamic, the fields that require validation for each button could change so I cant just bake different code onto the buttons.
I would want both buttons to be clickable so that the user could see which validations are or aren't met.
According to my comprehension of your issue, I see two possibilities, which can both can be handled with the 'reactive forms api' :
dynamically add controls to your form (ex: when a user check on 'rejected', a new comment field appears) => use the addControl / removeControl method of the FomGroup class
dynamically add validators to controls which already exist (ex: when a user click on the 'rejected' submit button, the comments field bacomes required) => use the setValidators method of the AbstractControl class
Also, don't foget to call the updateValueAndValidity method (AbstractControl class) after modifying controls or validators, otherwise the changes will not be detected.
Here is an excellent article on the subject : https://netbasal.com/three-ways-to-dynamically-alter-your-form-validation-in-angular-e5fd15f1e946