First page Back Continue Last page Graphics
The <sra-data> DOM Element
- Angular directives are Java Script routines that allow new HTML tags to be defined. All SIMRacingApps Widgets are implemented as directives, and the most basic one is called "sra-data". (i.e. You will see the "sra" abbreviated for SIMRacingApps throughout to identify attributes specific to SIMRacingApps. Similarly, "ng" is used by Angular for the same reason.)
- To use it, simply add it to the DOM as <sra-data></sra-data>.
- You need to have at least 2 attributes defined for this directive before it will do anything. Each one is prefixed with "data-" per the HTML5 specification for user defined attributes.
- <sra-data
data-sra-args-data = "the path(s) to subscribe to"
data-ng-bind = "data.path.ValueFormatted"
></sra-data>
- The results of "data-ng-bind" is assigned to the elements text value. It contains JavaScript code where all variables referenced are for the $scope instance assigned to this element. Using inheritance, data subscribed to by an element, is available to all it’s children.
- You can also use, “data-ng-bind-html” if you want to embed other html tags. Useful for adding “span” tags with a different class for formatting with CSS. Angular make sure the HTML is safe, but you can override it.
- These tags can be styled, either inline or with CSS and classes, just like any other tag.