Categories
Angular HTML Javascript Silly Wise Tips

Silly Wise Tip: How to make a comment on an Angular .HTML template which is not outputted

When you are used to the way of commenting on most of programming languages (usually with // or /* */ ) you can a find a bit nerving when you have to write a comment on an HTML template with our old friend <!– –>

It is not so handy, takes more time and it will be outputted on the .HTML template.

So in case you want a much more confortable, faster way to add a comment, with the plus that it won´t be outputted on the template and only you or other developers will read it, you can use this tricky solution I found on Stack Overflow. Is ugly but it works.

https://stackoverflow.com/questions/18063475/how-can-i-add-a-comment-for-developers-not-in-output-html-to-an-angular-templ

Since there still does not seem to be template syntax support for (non-html) comments the easiest way I found to do this is abusing the support for one line js comments in embedded expressions. Like this:

{{ '' // my comment }}

The empty string literal – which makes this even more ugly than it already is – is necessary because without it the angular compiler barfs out a ‘ERROR in TypeError: Cannot read property ‘visit’ of undefined’, at least with the 9.0.0 version I am on.