Odd Angular behaviour

So the functionality that I am going for is that if you click into the name field and do not have at least 2 characters an ngIf is supposed to run and make a bootstrap error message notifying the user that they need to fill out the name field.

However nothing happens at all, no errors no issues no nothing. So fixing and debugging the issue for me has been extremely challenging. I am learning Angular still and am very new to to it so I am not really sure what is going on or why.

You can find the code in two places:


Any help would seriously be appreciated! I am taking a class on Udemy and the code works fine for the instructor but not for me. :confused:

Your third <input> shares the same ref variable as the first (they’re both #userName!)