How to include html templates with angularjs? [duplicate]

Question

I'm trying to create a html fragement that should lateron serve as an image slider. So far it only contains a test div element:

slider.html:
<div>TEST</div>

I'm trying to include this in my index.html as follows:

<div ng-include src="slider.html"></div>

Result: I don't see the test div. Why?

@ajmajmajma You need to put single quotes around the string constant. — Martijn
– Martijn, Commented Aug 10, 2015 at 13:47
Already answered here:<br> stackoverflow.com/a/31609423/5052704 Hope this helps. — Vipul Agarwal
– Vipul Agarwal, Commented Aug 10, 2015 at 13:47
Already answered here <br> stackoverflow.com/a/31609423/5052704 Hope this helps. — Vipul Agarwal
– Vipul Agarwal, Commented Aug 10, 2015 at 13:49

Martijn · Accepted Answer · 2015-08-10 13:44:34Z

3

Try this:

<div ng-include="'slider.html'"></div>

When using a path in ng-include you need to enclose it with single quotes, since it expects an expression.

From the docs:

If the source is a string constant, make sure you wrap it in single quotes, e.g. src="'myPartialTemplate.html'".

answered Aug 10, 2015 at 13:44

Martijn

24.9k62 gold badges179 silver badges270 bronze badges

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

1 Comment

@membersound don't forget to mark a given answer as answered

Shrinivas Pai · Accepted Answer · 2015-08-10 13:48:05Z

1

<ng-include src="'slider.html'"></ng-include>

or

<div ng-include src="'slider.html'"></div>

answered Aug 10, 2015 at 13:48

Shrinivas Pai

7,7414 gold badges32 silver badges57 bronze badges

Community · Accepted Answer · 2017-05-23 12:06:13Z

0

You can include another html like below:

<div ng-include src = "'partials/myModule/myHtml.html'"></div>

Hope this helps.

CommunityBot

11 silver badge

answered Aug 10, 2015 at 13:50

Vipul Agarwal

1,6713 gold badges15 silver badges26 bronze badges