Interact with embedded dashboards

4

I’m also facing this issue and eventually figure out how to change grafana template variable programatically. Here is the code that works:

    let contentWindow = this.$refs.iframe.contentWindow; 

    let varService = contentWindow.angular
      .element('grafana-app')
      .injector()
      .get('variableSrv');

    let dashboard = contentWindow.angular
      .element('grafana-app')
      .injector()
      .get('dashboardSrv').dashboard;

    let v = varService.templateSrv.variables.find(
      ({ name }) => name === varName
    );

    if (!!v) {
      varService.setOptionAsCurrent(v, { text: varValue, value: varValue });
      varService.variableUpdated(v, false); // false to update manually via dashboard object

      dashboard.templateVariableValueUpdated();
      dashboard.startRefresh();
    }