How to select dom elements of current panel when panel is repeated in plugin?

Grafana Plugin Development
1

I have a repeating panel that inherits from MetricsPanelCtrl…

onRefersh() it makes an ajax call and sets values on the panel’s template using jquery selectors…

    $.getJSON(uri, result => {
       this.setData(result);
    });

Problem is when the panel is repeated only the first panel’s dom elements are set, even through I can see an ajax call was made for each panel. What seems to be happening is every ajax response set’s the first panel’s dom elements…

I suspect the answer may have something to do with scopedVars? I figured out I need templateSrv to get template vars to make my unique ajax request per panel, but thats only for text it seems, not dom elements…

2

UPDATE: My bad I was using elements with ids and selecting based on those, or course the panel is repeated so id no longer unique…

FIXED: By using AngularJS bindings in my html to panel.ctrl.blah where I set panel.blah in js…

HOWEVER: Would still like know how I would I manipulate only the panel’s dom from js… ?

3

I’m defining the Angular link() method in my controller class:

link(scope, elem, attrs, ctrl) {
    this.mydiv = elem.find('.mydivclass')[0];
}

Then I can be sure that this is the DIV belonging to the specific panel.

4

Do I need to do anything else for link to be called? Doesn’t seem to be being called when I add it…

5

No, it should work like this… It’s called only once at the very beginning. But I have to admit that I’m not very familiar with Angular yet.