diff --git a/public/app/plugins/datasource/cloud-monitoring/components/VariableQueryEditor.tsx b/public/app/plugins/datasource/cloud-monitoring/components/VariableQueryEditor.tsx
index ac3a804caaf..d8614ae7b26 100644
--- a/public/app/plugins/datasource/cloud-monitoring/components/VariableQueryEditor.tsx
+++ b/public/app/plugins/datasource/cloud-monitoring/components/VariableQueryEditor.tsx
@@ -160,7 +160,7 @@ export class CloudMonitoringVariableQueryEditor extends PureComponent<Props, Var
   async onMetricTypeChange(metricType: string) {
     const state = {
       selectedMetricType: metricType,
-      ...(await this.getLabels(metricType, this.state.projectName)),
+      ...(await this.getLabels(getTemplateSrv().replace(metricType), this.state.projectName)),
     };
     this.setState(state, () => this.onPropsChange());
   }
@@ -278,6 +278,7 @@ export class CloudMonitoringVariableQueryEditor extends PureComponent<Props, Var
             />
           </>
         );
+      case MetricFindQueryTypes.Services:
       case MetricFindQueryTypes.SLOServices:
         return (
           <>
diff --git a/public/app/plugins/datasource/cloud-monitoring/datasource.ts b/public/app/plugins/datasource/cloud-monitoring/datasource.ts
index 41ed0511c6e..11a062d40b2 100644
--- a/public/app/plugins/datasource/cloud-monitoring/datasource.ts
+++ b/public/app/plugins/datasource/cloud-monitoring/datasource.ts
@@ -108,7 +108,7 @@ export default class CloudMonitoringDatasource extends DataSourceWithBackend<
               crossSeriesReducer: aggregation?.crossSeriesReducer ?? 'REDUCE_NONE',
               view: 'HEADERS',
             },
-            metricType
+            this.templateSrv.replace(metricType)
           ),
         },
       ],