add event in osrm response

src/app/app.component.html

@@ -1,7 +1,6 @@
 <header>
-  <app-search></app-search>
+  <app-search (emitter)="onSearchResponse($event)"></app-search>
   <p>{{title}}</p>
 </header>
 
-<app-map #mapRef ></app-map>
-
+<app-map #mapRef></app-map>

src/app/app.component.ts

@@ -1,4 +1,6 @@
-import { Component, } from '@angular/core';
+import { Component, ViewChild, } from '@angular/core';
+import { Osrm } from './interfaces/osrm';
+import { MapComponent } from './map/map.component';
 
 
 @Component({
@@ -7,8 +9,15 @@ import { Component, } from '@angular/core';
   styleUrls: ['./app.component.css', '../../node_modules/ol/ol.css']
 })
 
+
+
 export class AppComponent {
   title = "Street Map";
+  @ViewChild('mapRef') mapCompopnent!: MapComponent;
 
+  onSearchResponse($event: Osrm): void {
+		this.mapCompopnent.drawPath($event);
+    this.mapCompopnent.updateSidebar($event);
+	}
 }
 

src/app/search/search.component.ts

@@ -1,4 +1,4 @@
-import { Component, ElementRef, ViewChild} from '@angular/core';
+import { Component, ElementRef, Output, ViewChild } from '@angular/core';
 import { Nominatim } from '../interfaces/nominatim';
 import { NominatimService } from '../services/nominatim.service';
 import { Photon, PhotonFeatureCollection } from '../interfaces/photon';
@@ -6,6 +6,7 @@ import { PhotonService } from '../services/photon.service';
 import { OsrmService } from '../services/osrm.service';
 import { Osrm } from '../interfaces/osrm';
 import { MapComponent } from '../map/map.component';
+import { EventEmitter } from '@angular/core';
 
 
 
@@ -35,7 +36,7 @@ export class SearchComponent{
   selectedPhotonFrom: Photon;
   selectedPhotonTo: Photon;
 
-  @ViewChild('mapRef') mapComponent!: MapComponent;
+  @Output() emitter = new EventEmitter<Osrm>();
 
   constructor(
     private nominatimService: NominatimService,
@@ -112,8 +113,11 @@ export class SearchComponent{
   getRoute(): void{
     this.osrmService.sendQueryRequest(this.longFrom, this.latFrom, this.longTo, this.latTo)
     .subscribe((response: Osrm) => {
+      this.emitter.emit(response);
+      /*
       this.mapComponent.updateSidebar(response);
       this.mapComponent.drawPath(response);
+      */
     }
     );
   }