How to create validation error messages in the Angular 2 Dynamic Forms paradigm.

In conflict to what I say here due to my learning a bit more, there is a way to do traditional validation messages with angry red messages unhiding when someone fills out a form field the wrong way. Alright, if FooGroup is a FormGroup with a FromGroup named BarGroup inside of it and BarGroup moreover has a control called Celly, you could dot dot dot out to Celly's setting like so:

alert(FooGroup.controls.Person.controls.Celly.value);

 
 

Celly, as a control also conveniently has a flag to let you know if its value has changed up. It's called dirty and dirty is true if the user has changed the value from what it was and false if not. Behold:

if(FooGroup.controls.Person.controls.Celly.dirty){    alert(FooGroup.controls.Person.controls.Celly.value);
}

 
 

Now for the good part! There is also a setting called .valid and it is also true or false and it does what we need.

<input type="text" class="typeInMe" formControlName="Celly">
<div [hidden]="FooGroup.controls.Person.controls.Celly.valid" class="youFool">
   That's not a phone number junior!
</div>