Developer Guide: Templates: Working With CSS in Angular

Work in Progress This page is currently being revised. It might be incomplete or contain inaccuracies.

Angular includes built-in CSS classes, which in turn have predefined CSS styles.

Built-in CSS classes

Usage: angular applies this class to a DOM element if that element contains an Expression that threw an exception when evaluated.

Styling: The built-in styling of the ng-exception class displays an error message surrounded by a solid red border, for example:

Error message

You can try to evaluate malformed expressions in expressions to see the ng-exception class' styling.

Usage: angular applies this class to an input widget element if that element's input does not pass validation. Note that you set the validation criteria on the input widget element using the Ng:validate or Ng:required directives.

Styling: The built-in styling of the ng-validation-error class turns the border of the input box red and includes a hovering UI element that includes more details of the validation error. You can see an example in ng:validate example.

Overriding Styles for Angular CSS Classes

To override the styles for angular's built-in CSS classes, you can do any of the following:

<link href="yourfile.css" rel="stylesheet" type="text/css">

Related Topics