Setting a unique ID for a node

The help for the template widget states:

<div id="{{'my_'+$id}}" style="{{'color:'+theme.base_color}}">Some text</div>
<script>
(function(scope) {
  scope.$watch('msg', function(msg) {
    if (msg) {
      // Do something when msg arrives
      $("#my_"+scope.$id).html(msg.payload);
    }
  });
})(scope);
</script>

I do not understand where the $id variable comes from or what it is. A google search revealed nothing for me. Reading the node red help online also led nowhere. I am missing something fundamental. Any pointers would be most appreciated.

It is a number that identifies the current scope of the template.

Say you have 2 or them with identical code - you use it to distinguish which "scope" (template) you are in.

in JavaScript, you access it via scope.$id in the HTML via $id or {{$id}}

So if scope.$id is 123 then id="{{'my_'+$id}}" becomes id="my_123"

Just for my own peace of mind, as I understand it scope.$id generates its own value, which is then used as the $id in "{{'my_'+$id}}" and trying to use scope.$id and $id in the body without the moustache is a bad idea.

Please let me know if this is wrong

@Steve-Mcl thank you for that. So this is Angular then is it? I am very new to node-red and unfamiliar with Angular. Are you able to point me to any resources for learning about how Angular works together with node red? I was unable to find anything much on the node red documentation website.

Although I have been a programmer for forty years (!) I have never used Angular - believe it or not. :slight_smile:

No, to be clear this is angularjs. angular is the successor of angularjs .

I am not an expert in angularjs (or angular for that matter) but there is tonnes of info around the net. Just be sure whatever tutorials or sample code you read/use is angularjs.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.