Sangeet Agarwal
Sangeet Agarwal

Reputation: 1825

declaring angular directives in markup

What is the best practice for declaring directives on a HTML page. Per the http://angular-ui.github.io/bootstrap/#/pagination the directive is shown as so

 <pagination total-items="bigTotalItems" ng-model="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-links="true" rotate="false" num-pages="numPages"></pagination>

per this stackoverflow question What are the advantages of using data- rather than x- prefix for custom attributes?

a better way of representing this directive would be as follows & conforms to HTML5 specifications

<div data-pagination data-total-items="totalItems" data-ng-model="currentPage" data-max-size="5" class="pagination-sm" data-boundary-links="true" data-rotate="false" data-ng-change="pageChanged()"></div>

Upvotes: 1

Views: 216

Answers (3)

user3681587
user3681587

Reputation: 566

data-ng-model = "user.name" and ng-model="user.name" provide you with the same outcome. You can use either. You can replace 'data' with 'x' and get the same outcome as well. You add the 'data' prefix to have them validated by html5 validators.

Upvotes: 0

harishr
harishr

Reputation: 18055

HTML validation isn't all that important. Sometimes they can be safely ignored. However just by adding a 'data-' prefix on all attributes, the editor would stop complaining about invalid html.

read more about it here

Upvotes: 1

louis amoros
louis amoros

Reputation: 2546

Both are the same -> angular directives. Use the shorter one.

Upvotes: 1

Related Questions