title: value in angular service setting to undefined
body: <p>i have 2 components comp A and comp B. when i click on a button in comp A, the value from the button goes to a service via Subject in RxJS. the button click also triggers a routerLink to change to comp B. the contents of comp B is based on the value of the button. Its working alright. WHen i click on the button the contents is displayed in comp B but when i refresh the page the service no longer holds the value that it recieved from comp A and that's why the values in comp B isnt shown. Any idea or workaround for this?</p>
  <p>my comp A:</p>
  <pre><code>onClickChange(event,index:number){
          this.statename=(this.renderedData[index].Name) 
          this.apiService.sendStateName(this.statename)    
          this.router.navigate(['/CompB']);
      } 
  </code></pre>
  <p>my service:</p>
  <pre><code>private subject=new BehaviorSubject&lt;string&gt;(&quot;DefaultValue&quot;)    
      name=this.subject.asObservable()    
      sendStateName(statename:string){    
        this.subject.next(statename)   
        this.name=statename
      }
  
  getData():Observable&lt;State&gt;{    
    return this.httpClient.get&lt;&gt;('http://localhost:8000/'+this.name)  
  }         
  </code></pre>