title: Facing issue to handle observable with jquery and angular
body: <p>I have requirement where I need to use jquery dataTables in angular 5 application. I am facing issue to refresh the token. Below is the code that I am using to achive this:</p>
  
  <pre><code>sendRequest() {
      const requestObject = {
          'url': '/getUsers',
          'type': 'GET',
          'beforeSend': self.refreshToken(),
          'error': function (xhr, error, thrown) {
                    if(xhr.status === 401) {
                    return self.refreshToken().concatMap(()  =&gt; {
                        self.sendRequest();
                      })
                    }
                  }
  }
  </code></pre>
  
  <p>And below is my code to refresh the token:</p>
  
  <pre><code>refreshToken(req, next) {
      const headers = new HttpHeaders()
          .set('Content-Type', 'application/x-www-form-urlencoded');
  
      const body = new HttpParams()
        .set('refresh_token', localStorage.getItem('refreshToken'));
       this._http.post('/refreshtoken',  body.toString(), {headers}).do(
         (data) =&gt; {
           const header = `Bearer ${(&lt;any&gt;data).accessToken}`;
          const newRequest = req.clone({ headers: req.headers.set('Authorization',  header)});
          return next.handle(newRequest);
         })
  
    }
  </code></pre>
  
  <p>But using above approach I am never able to call refresh token request. Please let me know what I am missing here.
  I am thinking that <code>do</code> function is not calling here.</p>