explore: add some extra time for angular query editors to update query (#16955)

Now when loading a query editor which changes the default query in the
constructor this will result in the actual updated query is used in
explore when running the query. Without this, the query used is sort
of out of sync between query editor and executed query.

public/app/features/explore/QueryEditor.tsx

@@ -41,11 +41,15 @@ export default class QueryEditor extends PureComponent<QueryEditorProps, any> {
         datasource,
         datasource,
         target,
         target,
         refresh: () => {
         refresh: () => {
-          this.props.onQueryChange(target);
-          this.props.onExecuteQuery();
+          setTimeout(() => {
+            this.props.onQueryChange(target);
+            this.props.onExecuteQuery();
+          }, 1);
         },
         },
         onQueryChange: () => {
         onQueryChange: () => {
-          this.props.onQueryChange(target);
+          setTimeout(() => {
+            this.props.onQueryChange(target);
+          }, 1);
         },
         },
         events: exploreEvents,
         events: exploreEvents,
         panel: { datasource, targets: [target] },
         panel: { datasource, targets: [target] },
@@ -54,7 +58,9 @@ export default class QueryEditor extends PureComponent<QueryEditorProps, any> {
     };
     };
 
 
     this.component = loader.load(this.element, scopeProps, template);
     this.component = loader.load(this.element, scopeProps, template);
-    this.props.onQueryChange(target);
+    setTimeout(() => {
+      this.props.onQueryChange(target);
+    }, 1);
   }
   }
 
 
   componentDidUpdate(prevProps: QueryEditorProps) {
   componentDidUpdate(prevProps: QueryEditorProps) {