title: Angular 4 to 5 Upgrade - Observable.of
body: <p>I am attempting to update some Angular 4 /rxjs code to use the new version 5 syntax and am running into some trouble.</p>
  
  <p>Original Import Statements:</p>
  
  <pre><code>import { Injectable } from '@angular/core';
  import { Http, Response, Headers, RequestOptions } from '@angular/http';
  import { Observable } from 'rxjs/Observable';
  import Properties from './properties';
  import ErrorHandler from './error-handler';
  
  //From vendor.ts
  import 'rxjs/Subject'
  import 'rxjs/BehaviorSubject';
  import 'rxjs/Observable';
  import 'rxjs/add/operator/catch';
  import 'rxjs/add/operator/filter';
  import 'rxjs/add/operator/map';
  import 'rxjs/add/operator/switchMap';
  import 'rxjs/add/operator/mergeMap';
  import 'rxjs/add/operator/debounceTime';
  import 'rxjs/add/operator/timeoutWith';
  import 'rxjs/add/operator/retryWhen';
  import 'rxjs/add/operator/delay';
  import 'rxjs/add/operator/distinctUntilChanged';
  import 'rxjs/add/observable/of';
  import 'rxjs/add/operator/publishReplay';
  import 'rxjs/Subscription';
  </code></pre>
  
  <p>Original Code:</p>
  
  <pre><code>downloadStatus(job : DownloadJob) : Observable&lt;DownloadJob&gt; {
      let params = {"jobId": job.id};
      return this.http.post(Properties.URLS.core.downloadStatus.href, params, this.getOptions())
                  .retryWhen((errors) =&gt; {
                      return errors.mergeMap((error) =&gt; (error.status === 404) ? Observable.of(error) : Observable.throw(error))
                                      .delay(Properties.SETTINGS.download.pollInterval);
                  })
                  .timeoutWith(Properties.SETTINGS.download.timeout, Observable.of&lt;DownloadJob&gt;(job))
                  .map(this.extractData).catch(ErrorHandler.handleError);
  }
  </code></pre>
  
  <p>Updated Import Statements:</p>
  
  <pre><code>import { Injectable } from '@angular/core';
  import { Http, Response, Headers, RequestOptions } from '@angular/http';
  import { Observable } from 'rxjs/Observable';
  import { map, catchError, retryWhen, timeoutWith, flatMap, mergeMap, delay } from 'rxjs/operators';
  import { of } from 'rxjs/observable/of';
  import Properties from './properties';
  import ErrorHandler from './error-handler';
  //From vendor.ts
  import 'rxjs/Subject'
  import 'rxjs/BehaviorSubject';
  import 'rxjs/Observable';
  import 'rxjs/operators/catchError';
  import 'rxjs/operators/filter';
  import 'rxjs/operators/map';
  import 'rxjs/operators/switchMap';
  import 'rxjs/operators/mergeMap';
  import 'rxjs/operators/debounceTime';
  import 'rxjs/operators/timeoutWith';
  import 'rxjs/operators/retryWhen';
  import 'rxjs/operators/delay';
  import 'rxjs/operators/distinctUntilChanged';
  import 'rxjs/operators/publishReplay';
  import 'rxjs/observable/of';
  import 'rxjs/Subscription';
  </code></pre>
  
  <p>Updated Code:</p>
  
  <pre><code>downloadStatus(job : DownloadJob) : Observable&lt;DownloadJob&gt; {
      let params = {"jobId": job.id};
      return this.http.post(Properties.URLS.core.downloadStatus.href, params, this.getOptions()).pipe(
                  retryWhen((errors) =&gt; {
                      return errors.pipe(
                                  mergeMap((error) =&gt; (error.status === 404) ? of(error) : Observable.throw(error)),
                                  delay(Properties.SETTINGS.download.pollInterval)
                      );
                  }),
                  timeoutWith(Properties.SETTINGS.download.timeout, of(job)),
                  map(this.extractData),
                  catchError(ErrorHandler.handleError)
      );
  }
  </code></pre>
  
  <p>Error Message: </p>
  
  <pre><code>TS2345: Argument of type 'UnaryFunction&lt;Observable&lt;DownloadJob&gt;, Observable&lt;DownloadJob&gt;&gt;' is not assignable to parameter of type 'UnaryFunction&lt;Observable&lt;Response&gt;, Observable&lt;DownloadJob&gt;&gt;'.
    Types of parameters 'source' and 'source' are incompatible.
      Type 'Observable&lt;Response&gt;' is not assignable to type 'Observable&lt;DownloadJob&gt;'.
        Type 'Response' is not assignable to type 'DownloadJob'.
          Property 'id' is missing in type 'Response'.
  </code></pre>
  
  <p>The problem I am having is with the conversion from Observable.of(job) in the timeoutWith function to of(job).  The TypeScript compiler is now (understandably) complaining about being able to assign the object type.  </p>
  
  <p>With this new syntax how to I fix that?</p>
  
  <p>Thanks in advance!</p>