Third-party AngularJS library dependency

Dear Community,

I am new to Grafana plugin development and also to AngularJS, and there is something that should be simple but I can’t get my head around.
I would like to use a third-party AngularJS library, namely AngularJS Material. Following their Getting started page, (https://material.angularjs.org/latest/getting-started), I am including the needed js file (in query.editor.html, using a script tag), just like the css, and registering the dependencies on the module using angular.module(‘grafana’, [‘ngMaterial’, ‘ngMessages’]); . When I try to use the desired functionality ( ) It doesn’t work, and I’m not surprised about that.
When I check the source of other plugins, I don’t see js libraries imported with tags from html, also don’t see the usage of angular.module(). I think I’m missing some conceptual knowledge. Could anyone point me to the right direction here please? Maybe some material to read on this? I kept searching for answers here in the Community and read the articles about grafana plugin development, but I didn’t find much, even though this seems to be quite a basic thing to do I would say.

Thanks in advance!

Peter

There are couple of examples using angularjs-material, and also an example using “angular.module()”

Here’s angular.module() in the diagram panel:

And an unfinished plugin using angularjs-material with internal libs (I really need to finish that one!)

Hope that helps,

Brian

Dear Brian,

Hello. I am also new to grafana panel plugin development and I have to say your examples were really helpful.

I have a question for you regarding angularjs-material too. Let’s say that I want to use the $mdDialog service. How could I get access to it in my panel plugin controller, if there is no sevice provider? Could I inject a dependency to angularjs-material in the whole grafana app? Would that actually work and would it be a good idea?

I also want to point out that I am aware that a dialog can be opened in grafana using the “show-modal” app event. I am only asking this question in case there is a need to use a similar service in the future.

Thank you in advance,
Yannis

I have not tried to inject a dependency like that, in theory it should work.

I’ve seen one plugin example using that method, will locate it and provide a link.

@bkgann, thank you very much, that would be a huge help!

I am eagerly awaiting your response.