How to use AngularJS without custom HTML tags?

Question

I’m trying to use UI Bootstrap’s inline datepicker, but it works with a custom tag:

<datepicker ng-model="dt" min-date="minDate"></datepicker>

My template processor doesn’t support custom tags, is there a way to have this working with a standard tag, e.g. something like <div ng-something="datepicker"></div>?

There have been discussions on how/why AngularJS uses custom tags here and here, and AngularJS has some doc on how make IE8 accept custom tags using JS, but my problem is at the HTML generation step, i.e. it’s not a problem with the browser.

Note that I can’t change my template processor, and this question is larger than that since you have to use standard tags if you want to have a W3C-compliant HTML. AngularJS lets you use standard attributes (by prepending data-), but I can’t find a way to use standard tags.

Nebril · Accepted Answer · 2014-08-01 09:46:42Z

3

You may try something along these lines:

<div data-datepicker ng-model="dt" min-date="minDate"></div>

EDIT: It should work, as the datepicker directive from ui-bootstrap (https://github.com/angular-ui/bootstrap/blob/master/src/datepicker/datepicker.js) seems to have restrict attribute set to 'EA', which means, that you can use it by Element or Attribute. So I think you're good to go with my example provided above.

answered Aug 1, 2014 at 9:46

Nebril

3,3211 gold badge35 silver badges51 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to use AngularJS without custom HTML tags?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related