Is it safe to use ampersands (&) in AngularJS html templates

Question

I have been told that using ampersands in angular templates is bad practice since '&' is reserved in HTML, but I see it in examples for angular all the time.

To be clear, would it be safe to write

<div ng-show="bool1 && bool2"></div>

in an angular template?

I'm not interested in knowing if it works (it does), but if there are any edge cases where this could cause problems or if it's in fact discouraged.

possible duplicate of [Are complex expressions possible in ng-hide / ng-show?](http://stackoverflow.com/questions/15166184/are-complex-expressions-possible-in-ng-hide-ng-show) — bransonl, Sep 03 '15 at 13:23
I'm more interested in how this works with HTML not allowing use of '&' except for HTML character entities. — Jacob Sievers, Sep 03 '15 at 13:34
Thymeleaf gives a SAXParseException while using them. So you shouldn't use them if you're also using Thymeleaf. — cst1992, Oct 27 '16 at 06:17

score 4 · Accepted Answer · edited Feb 03 '17 at 16:47

It's fine. The HTML5 spec explicitly allows unencoded ampersands if they don't look like a character reference (such as ©). Sure, for some things like URLs it's better to be consistent and escape them. But for && with spaces around it, there's no chance that the browser will misinterpret the data, and && is significantly less readable.

Relevant Sections of the spec:

score 2 · Answer 2 · answered Sep 03 '15 at 13:23

2

I use ampersands in my Angular html templates too and never had a problem with them, but the best way to see if it's safe for you to use them is to just test their effect in a test app that resembles yours I guess...

answered Sep 03 '15 at 13:23

FullyHumanProgrammer

101
1
4
19

1

I'd rather know what the best practice is. For example, http://stackoverflow.com/questions/3493405/do-i-really-need-to-encode-as-amp suggests that you should never use it in HTML. – Jacob Sievers Sep 03 '15 at 13:31
1

The best practice is always the safest, and for safety I would suggest (just like the question you linked) to escape your ampersands. – FullyHumanProgrammer Sep 03 '15 at 13:34
I find it much easier to simply escape them rather than worry if they _need_ to be escaped. Example: in a link like ``, do you _need_ to escape the ampersand to avoid it being interpreted as `&ordm`? But if you just always write `&` everywhere, the question won't even come up. – Mr Lister Sep 05 '15 at 07:29

score -1 · Answer 3 · answered Sep 03 '15 at 13:23

-1

Yes that is just fine, I use it all the time. Here's a fiddle showcasing:

 <div data-ng-show="bool1 && bool2">bool1 && bool2</div>
 <div data-ng-show="bool1 && !bool2">bool1 && !bool2</div>
 <div data-ng-show="!bool1 && bool2">!bool1 && bool2</div>
 <div data-ng-show="!bool1 && !bool2">!bool1 && !bool2</div>

http://jsfiddle.net/8drnp4ue/

answered Sep 03 '15 at 13:23

Mathew Berg

26,908
11
66
86

Do you know how this stands in relation to http://stackoverflow.com/questions/3493405/do-i-really-need-to-encode-as-amp ? Thanks! – Jacob Sievers Sep 03 '15 at 13:32
In that case: how? This is stored as regular HTML. – Jacob Sievers Sep 03 '15 at 15:41

Is it safe to use ampersands (&) in AngularJS html templates

3 Answers3