title: Passing data from a component to service and then to another component
body: <p><strong>First Component.ts</strong></p>
  
  <pre><code>onRecievingResults(value){
      console.log(value);
      this.faqService.saveData(value);
      console.log(value);
      this.router.navigate(['results'], {relativeTo: this.route});}
  }
  </code></pre>
  
  <p>In this <code>onRecievingResults()</code> function, on click of a button, I am saving the input text to a method <code>saveData()</code> in a service known as <code>faqService</code>.</p>
  
  <p><strong>Service.ts</strong></p>
  
  <pre><code>saveData(value){
      console.log("save data function called " + value + this.sharingData.name);
      this.sharingData.name;
  }
  getData()
  {
      console.log('get Data function called ');
      return this.sharingData.name;
  }
  getServers(name){
      return this.http.get(Staticdata.apiBaseUrl + "/2.2/search/advanced?key="+ Staticdata.key +"&amp;access_token="+ Staticdata.access_token +"&amp;/2.2/search/advanced?order=desc&amp;sort=activity&amp;accepted=True&amp;closed=True&amp;title=" + name + Staticdata.redirectUrl + "&amp;filter="+ Staticdata.filters)
          .map(
          (response: Response) =&gt; {
              const items = response.json();
              return items;
          },
      )
      .catch(
          (error: Response) =&gt; {
              return Observable.throw(error);
          }
      );  
    }
  }
  </code></pre>
  
  <p>In this service I have 3 methods <code>getData()</code>, here I get the value from the first component and store it in another method known as <code>saveData()</code>.
  <code>getServers()</code> method is used to make Http request.</p>
  
  <p><strong>Second component.ts</strong></p>
  
  <pre><code>export class SearchResultsComponent implements OnInit {
  
   data: any[];   
   item: any[];
   myName:any;
  
   constructor(private service: FaqService) {
    this.service =  service;
    console.log('back called');
    this.myName = service.getData();  
    console.log(this.myName);
   }
  
   ngOnInit() {
    this.service.getServers(this.myName)
          .subscribe(
          (data) =&gt; {
              this.item= data.items;
              console.log(this.item);
          },
          (error) =&gt; console.log(error)
      ); 
      }
    }
  </code></pre>
  
  <p>Here in this, I call the method <code>getData()</code> to get the value and get the results from the Http request.</p>
  
  <p>The problem here is it takes junk value and gives the results. How to dynamically take text from inputbox and store it in service and pass it to the other component.</p>