feat(templating): fixes for influxdb template variable formating, #2918

public/app/plugins/datasource/influxdb/datasource.ts

@@ -35,7 +35,7 @@ export function InfluxDatasource(instanceSettings, $q, backendSrv, templateSrv)
 
 
       // build query
       // build query
       var queryModel = new InfluxQuery(target, templateSrv, options.scopedVars);
       var queryModel = new InfluxQuery(target, templateSrv, options.scopedVars);
-      var query =  queryModel.render();
+      var query =  queryModel.render(true);
       query = query.replace(/\$interval/g, (target.interval || options.interval));
       query = query.replace(/\$interval/g, (target.interval || options.interval));
       return query;
       return query;
 
 

public/app/plugins/datasource/influxdb/influx_query.ts

@@ -11,7 +11,7 @@ export default class InfluxQuery {
   templateSrv: any;
   templateSrv: any;
   scopedVars: any;
   scopedVars: any;
 
 
-  constructor(target, templateSrv, scopedVars) {
+  constructor(target, templateSrv?, scopedVars?) {
     this.target = target;
     this.target = target;
     this.templateSrv = templateSrv;
     this.templateSrv = templateSrv;
     this.scopedVars = scopedVars;
     this.scopedVars = scopedVars;
@@ -130,7 +130,7 @@ export default class InfluxQuery {
     this.updatePersistedParts();
     this.updatePersistedParts();
   }
   }
 
 
-  private renderTagCondition(tag, index) {
+  private renderTagCondition(tag, index, interpolate) {
     var str = "";
     var str = "";
     var operator = tag.operator;
     var operator = tag.operator;
     var value = tag.value;
     var value = tag.value;
@@ -148,9 +148,11 @@ export default class InfluxQuery {
 
 
     // quote value unless regex
     // quote value unless regex
     if (operator !== '=~' && operator !== '!~') {
     if (operator !== '=~' && operator !== '!~') {
-      value = this.templateSrv.replace(value, this.scopedVars);
+      if (interpolate) {
+        value = this.templateSrv.replace(value, this.scopedVars);
+      }
       value = "'" + value.replace('\\', '\\\\') + "'";
       value = "'" + value.replace('\\', '\\\\') + "'";
-    } else {
+    } else if (interpolate){
       value = this.templateSrv.replace(value, this.scopedVars, 'regex');
       value = this.templateSrv.replace(value, this.scopedVars, 'regex');
     }
     }
 
 
@@ -174,11 +176,15 @@ export default class InfluxQuery {
     return policy + measurement;
     return policy + measurement;
   }
   }
 
 
-  render() {
+  render(interpolate?) {
     var target = this.target;
     var target = this.target;
 
 
     if (target.rawQuery) {
     if (target.rawQuery) {
-      return target.query;
+      if (interpolate) {
+        return this.templateSrv.replace(target.query, this.scopedVars, 'regex');
+      } else {
+        return target.query;
+      }
     }
     }
 
 
     if (!target.measurement) {
     if (!target.measurement) {
@@ -203,7 +209,7 @@ export default class InfluxQuery {
 
 
     query += ' FROM ' + this.getMeasurementAndPolicy() + ' WHERE ';
     query += ' FROM ' + this.getMeasurementAndPolicy() + ' WHERE ';
     var conditions = _.map(target.tags, (tag, index) => {
     var conditions = _.map(target.tags, (tag, index) => {
-      return this.renderTagCondition(tag, index);
+      return this.renderTagCondition(tag, index, interpolate);
     });
     });
 
 
     query += conditions.join(' ');
     query += conditions.join(' ');
@@ -227,8 +233,6 @@ export default class InfluxQuery {
       query += ' fill(' + target.fill + ')';
       query += ' fill(' + target.fill + ')';
     }
     }
 
 
-    target.query = query;
-
     return query;
     return query;
   }
   }
 }
 }

public/app/plugins/datasource/influxdb/query_ctrl.ts

@@ -154,6 +154,7 @@ export class InfluxQueryCtrl extends QueryCtrl {
   }
   }
 
 
   toggleEditorMode() {
   toggleEditorMode() {
+    this.target.query = this.queryModel.render(false);
     this.target.rawQuery = !this.target.rawQuery;
     this.target.rawQuery = !this.target.rawQuery;
   }
   }