I have always found that forms are the bane of clean, neat, organized HTML templates. Even small forms, well indented and separated by comments, look cluttered to my eyes. To solve this problem in an Angular way, we can create directives that keep forms input organized. Here's an example of what I use when creating a form for Toolwatch.io:
<toolwatch-input
[id] = "'email'"
[control] = "loginForm.controls.email"
[errorLabel] = "'email-required'"
[submitAttempt] = "submitAttempt"
[autoCapitalize] = false
[autoCorrect] = false
[spellCheck] = false
>
As you can see, the directive accepts a different @Input parameter that controls how the input will look and behave.
Here's the related component:
import {...