Using AngularJs for node interface

#1

Hello,

Is there an example of how to use AngularJs for building the UI of a node? I am talking about using it in the .html file associated with a node, because I did not manage to find an example about this.

Thank you in advance!

0 Likes

#2

We don’t use angular for the html for the editor.
The dashboard does use angular but for the ui itself not the config of those nodes.

0 Likes

#3

Thanks for the quick response!

Just in order to clarify, is Angular not supported by node-red for building the config or is simply not used? So if I wanted to write a node config using Angular, it would not work?

0 Likes

#4

I am not aware of anyone using angular to build the node edit dialog. You may just have to try it.

0 Likes

#5

You might want to think about why you want Angular. JQuery is used and is available.

My worry about using Angular would be the browser overheads it would add. We already have D3 and JQuery, maybe some other things.

0 Likes

#6

Indeed. Seems like a lot of overhead to add for a few input elements.

0 Likes

#7

Thank you all for the responses. Indeed it can be too much overhead for some simple edit boxes. I will try though to use it if something more complex os required.

0 Likes

#8

Given the many versions of Angular, I hope you’re up for the ongoing maintanence task :slight_smile:

0 Likes

#9

I have a follow up question because I tried to use angular and could not make it work.
I included a script tag for angular in the file /node-red/editor/templates/index.mst (the reason being that including it in the html file of the node didn't guarantee that it was loaded in time).
After that I tried to create and app and controller in the text/javascript section associated with the html file of the node.

Here you can see the code https://pastebin.com/raw/J6nATt0A. It seems that the code inside the controller is never executed.

Any idea on why it does not work?

Thank you in advance!

0 Likes