1

I have begun to learn angular js for some time and so far I have used 2 types of prefixes. They are the ng- and data-ng. But when I go through angular library I found this array.

var ngAttrPrefixes = ['ng-', 'data-ng-', 'ng:', 'x-ng-'];

So is this mean there are 4 types of prefixes available in angular. So what are the differences of each other. What are the situations that need to decide which prefix need to choose.

Sachila Ranawaka
  • 39,756
  • 7
  • 56
  • 80

1 Answers1

1

From angular-documentation,

AngularJS normalizes an element's tag and attribute name to determine which elements match which directives. We typically refer to directives by their case-sensitive camelCase normalized name (e.g. ngModel). However, since HTML is case-insensitive, we refer to directives in the DOM by lower-case forms, typically using dash-delimited attributes on DOM elements (e.g. ng-model).

based on above statement below all are valid directives

  1. ng-bind
  2. ng:bind
  3. ng_bind
  4. data-ng-bind
  5. x-ng-bind

DEMO

Sajeetharan
  • 216,225
  • 63
  • 350
  • 396
  • thanks @Sajeetharan. i can understand since html case insensitive they are using lower case and dash line. but why so many prefixes. only one type is enough ne – Sachila Ranawaka Jan 26 '17 at 05:32
  • None in terms of the runtime behavior, those are just different styles of naming directiveshttp://stackoverflow.com/questions/16184428/what-is-the-difference-between-ng-app-and-data-ng-app – Sajeetharan Jan 26 '17 at 05:37
  • 1
    well turns out html validation programs don't recognize `ng-app` attr. thats why they used different prefixes to support validation programs – Sachila Ranawaka Jan 26 '17 at 05:47