# Using AngularJs for node interface

**URL:** <https://discourse.nodered.org/t/using-angularjs-for-node-interface/1966>\
**Category:** General\
**Created:** [1 August 2018 08:43 UTC](https://discourse.nodered.org/t/using-angularjs-for-node-interface/1966 "2018-08-01T08:43:03Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![CatalinFetoiu](https://avatars.discourse-cdn.com/v4/letter/c/4bbf92/32.png) [@CatalinFetoiu](https://discourse.nodered.org/u/CatalinFetoiu)\
**Post date:** [1 August 2018 08:43 UTC](https://discourse.nodered.org/t/using-angularjs-for-node-interface/1966/1 "2018-08-01T08:43:03Z")

</div>

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!

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [1 August 2018 11:19 UTC](https://discourse.nodered.org/t/using-angularjs-for-node-interface/1966/2 "2018-08-01T11:19:38Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![CatalinFetoiu](https://avatars.discourse-cdn.com/v4/letter/c/4bbf92/32.png) [@CatalinFetoiu](https://discourse.nodered.org/u/CatalinFetoiu)\
**Post date:** [1 August 2018 11:50 UTC](https://discourse.nodered.org/t/using-angularjs-for-node-interface/1966/3 "2018-08-01T11:50:34Z")

</div>

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?

---

<div class="post-metadata">

**Author:** ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)\
**Post date:** [1 August 2018 11:53 UTC](https://discourse.nodered.org/t/using-angularjs-for-node-interface/1966/4 "2018-08-01T11:53:10Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [1 August 2018 14:35 UTC](https://discourse.nodered.org/t/using-angularjs-for-node-interface/1966/5 "2018-08-01T14:35:00Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [1 August 2018 14:50 UTC](https://discourse.nodered.org/t/using-angularjs-for-node-interface/1966/6 "2018-08-01T14:50:29Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![CatalinFetoiu](https://avatars.discourse-cdn.com/v4/letter/c/4bbf92/32.png) [@CatalinFetoiu](https://discourse.nodered.org/u/CatalinFetoiu)\
**Post date:** [1 August 2018 17:44 UTC](https://discourse.nodered.org/t/using-angularjs-for-node-interface/1966/7 "2018-08-01T17:44:38Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [1 August 2018 18:07 UTC](https://discourse.nodered.org/t/using-angularjs-for-node-interface/1966/8 "2018-08-01T18:07:53Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![CatalinFetoiu](https://avatars.discourse-cdn.com/v4/letter/c/4bbf92/32.png) [@CatalinFetoiu](https://discourse.nodered.org/u/CatalinFetoiu)\
**Post date:** [2 August 2018 14:11 UTC](https://discourse.nodered.org/t/using-angularjs-for-node-interface/1966/9 "2018-08-02T14:11:53Z")

</div>

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](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!
