Search within TutorialsPark

AngularJS Special Attributes

Learn how to use AngularJS Special Boolean and Other Attributes .

AngularJS Special Attributes : Boolean Attributes

The AngularJS has a set Special Attributes for some special purposes.Generally, the value of the attributes is most critical part of the Attribute.

But Some Attributes don't need attribute values and instead the mere presence of these attributes is all that matters.These Attributes are called as Boolean Attributes.

A good Example is the attribute checked, which is used to denote a particular checkbox as checked when the element first gets loaded, no value of attribute is required, simply presence of attribute is sufficient.

Table : AngularJS Event Handling Event Directives

Name Description Try It
ng-checked To set the checked attribute on input elements Try»
ng-disabled To set disabled attribute on input and button element. Try»
ng-open To set open attribute on details element. Try»
ng-readonly To set readonly attribute on input element. Try»
ng-selected To set selected attribute on option element. Try»

AngularJS Boolean Attributes : Using Boolean Attributes with Values

Boolean Attributes unlike other Attributes do not require values, however you can assign values to Boolean attributes to manage the state of elements.

In the demo, we define a model property called inputStatus to manage the status of button Element, a bi-directional data binding is created using directive ng-model

If the expression within the directive ng-disabled i.e inputStatus is true, the attribute disabled is added to the element in the DOM.

: AngularJS Boolean Attributes Using Boolean Attributes with Values

Give it a TRY! » Note:When the value of directive is evaluated to false, the button becomes active.

AngularJS Special Attributes : Other Boolean Attributes

Other than the Boolean Attributes mentioned above, there are also some attributes that need to be along with other HTML elements, since AngularJS cannot operate on them directly.

AngularJS binding features and are available for these attributes. The table shows a complete list of such attributes.

Table : AngularJS Special Attributes Managing Other Attributes

Name Description
ng-href To set the attribute href on a elements
ng-src To set the attribute src on img elements
ng-srcset To set the attribute srcset for img elements