What is textarea in AngularJS?

AngularJS modifies the default behavior of textarea by using the ng-model attribute. It provides data-binding and can, therefore, be updated by AngularJS functions and DOM.

AngularJS can be used to provide validation. The $valid state of a textarea is set to false as long as it is empty (even if it is required field).

It also provides control of the current state by holding the states of all textarea elements. These elements have the following boolean states:

  • $untouched: The field has not been touched
  • $touched: The field has been touched
  • $pristine: The field has not been modified
  • $dirty: The field has been modified
  • $invalid: The field content is not valid
  • $valid The field content is valid

You can use the AngularJS textbox with the following code:

<textarea ng-model="PhoneNumber"></textarea>

You can also apply multiple CSS onto each state using the following attributes:

  • ng-untouched: The field has not been touched
  • ng-touched: The field has been touched
  • ng-pristine: The field has not been modified
  • ng-dirty: The field has been modified
  • ng-invalid: The field content is not valid
  • ng-valid The field content is valid
  • ng-valid-key: One key for each validation, e.g., `ng-valid-required1
  • ng-invalid-key: Opposite to ng-valid-key

Free Resources

Copyright ©2025 Educative, Inc. All rights reserved