Bind AngularJS model into html comment for debug purposes

Question

I need to debug an object id. This kind of object appears many many times on my interface and using log would be difficult to track.

I want to be able to click on the specific object and with the inspector be able to see a comment with it's id. Basically put something like following on my template:

<!-- {{object.id}} -->

So it shows something like:

<!-- 182371923129837 -->

I'm trying exactly that, but on the html comment I just get:

<!-- {{object.id}} -->

Instead of the number I want to see. Tried searching first, but found nothing resembling this issue. What am I missing?

Answer 1

You can't do this directly, angular will not compile html comments, and even if you tried to generate the comment text yourself like contcating {{"<!--"+ somedata +"-->"}} it will not work and if you tried to trust it as html you can't bind to comment that's why you need to check this answer

see this answer https://stackoverflow.com/a/28245596/916952