title: How to fix "Error: You provided 'undefined' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable"?
body: <p>I'm using angular material table in that pagination is not working only in server but working fine in local. In server when I'll open the page which contains the table, the data is pushed in the table but the pagination is not working and error is popup</p>
  
  <blockquote>
  <pre><code>ERROR TypeError: You provided 'undefined' where a stream was expected.
  You can provide an Observable, Promise, Array, or Iterable.
      at subscribeTo (subscribeTo.js:41)
      at subscribeToResult (subscribeToResult.js:11)
      at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._innerSub
  (mergeMap.js:74)
      at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._tryNext
  (mergeMap.js:68)
      at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._next
  (mergeMap.js:51)
      at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next
  (Subscriber.js:53)
      at Observable._subscribe (subscribeToArray.js:5)
      at Observable.push../node_modules/rxjs/_esm5/internal/Observable.js.Observable._trySubscribe
  (Observable.js:43)
      at Observable.push../node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe
  (Observable.js:29)
      at MergeMapOperator.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapOperator.call
  (mergeMap.js:29)
  </code></pre>
  </blockquote>
  
  <p>Component.ts</p>
  
  <pre><code>getCustomerinfoList(): void {
      this.adminService.getCustomerinfoList(this.componentName, this.selectedCustomer.customer_id)
        .subscribe(customerlist =&gt; {
          let c_rates = customerlist[0][0].customer_routes;
          this.customers = customerlist;
          this.cust_specificData = c_rates ? JSON.parse(c_rates) : [];
          this.cInfo_dataSource.data = this.cust_specificData
          this.cInfo_dataSource.paginator = this.Routepaginator;
          this.cInfo_dataSource.sort = this.Routesort;
        }
    }
  </code></pre>
  
  <p>service.ts</p>
  
  <pre><code>getCustomerinfoList(actionComponentName: String, customerid: number) {
      const url = `${this.baseURL + actionComponentName}/getCustomerRateAccessories?customer_id=${customerid}&amp;access_token=${this.authService.getAuthToken()}`;
      return this.http.get&lt;any&gt;(url, this.httpOptions)
    }
  </code></pre>
  
  <p>Interceptor.ts</p>
  
  <pre><code>import { Injectable } from '@angular/core';
  import { HttpEvent, HttpInterceptor, HttpHandler, HttpResponse } from '@angular/common/http';
  
  import { Observable } from 'rxjs/Rx';
  import 'rxjs/add/observable/throw'
  import { tap, catchError } from 'rxjs/operators';
  
  
  @Injectable()
  
  export class loadingInterceptor implements HttpInterceptor {
  
    intercept(req: any, next: HttpHandler): Observable&lt;HttpEvent&lt;any&gt;&gt; {
  
      let loadingContainer: HTMLElement = document.getElementsByClassName('bg-pre-loader').item(0) as HTMLElement
  
      loadingContainer.style.display = 'flex';
  
      return next.handle(req).pipe(
        tap(event =&gt; {
          if (event instanceof HttpResponse) {
            loadingContainer.style.display = 'none';
          }
        }), catchError((err) =&gt; {
          loadingContainer.style.display = 'none';
          return Observable.throw(err);
        })
      )
    }
  }
  </code></pre>
  
  <p>I expect the data should push in table and the data should able to paginate</p>
  
  <p>note:
  this code work fine in local,
  only in server it's not working as expected</p>