Examples
Component-first input patterns built around <tng-input>. Adornment-heavy compositions now live on the dedicated Input Field page.
Form usage
A live submit-ready input example using controlled component state.
Input form usage
Signal form number defaults
A number input example bound directly to Angular Signal Forms with defaults from the model.
Signal form number defaults
Basic text field
The default component path for a plain single-line input.
Basic text field (Plain-CSS)
Basic text field (Tailwind CSS)
Type variants
The same component API works across the supported native input types.
Type variants (Plain-CSS)
Type variants (Tailwind CSS)
Validation feedback
Invalid input state with explicit helper text.
Validation feedback (Plain-CSS)
Enter a valid email address in user@domain format.
Validation feedback (Tailwind CSS)
Enter a valid email address in user@domain format.
Number controls
Custom stepper buttons for numeric fields. Arrow, page, Home, and End keys use the same value path.
Number controls (Plain-CSS)
Number controls (Tailwind CSS)
Readonly and disabled states
Side-by-side state treatment for readonly and disabled fields.