title: Cannot read property 'length' of null when using MatPaginator
body: <p>I keep on getting this error:</p>
  
  <pre><code>core.js:1542 ERROR TypeError: Cannot read property 'length' of null
  at MatTableDataSource.push../node_modules/@angular/material/esm5/table.es5.js.MatTableDataSource._filterData (table.es5.js:702)
  at MapSubscriber.project (table.es5.js:657)
  at MapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/map.js.MapSubscriber._next (map.js:35)
  at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
  at CombineLatestSubscriber.push../node_modules/rxjs/_esm5/internal/observable/combineLatest.js.CombineLatestSubscriber.notifyNext (combineLatest.js:83)
  at InnerSubscriber.push../node_modules/rxjs/_esm5/internal/InnerSubscriber.js.InnerSubscriber._next (InnerSubscriber.js:15)
  at InnerSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
  at BehaviorSubject.push../node_modules/rxjs/_esm5/internal/BehaviorSubject.js.BehaviorSubject._subscribe (BehaviorSubject.js:22)
  at BehaviorSubject.push../node_modules/rxjs/_esm5/internal/Observable.js.Observable._trySubscribe (Observable.js:42)
  at BehaviorSubject.push../node_modules/rxjs/_esm5/internal/Subject.js.Subject._trySubscribe (Subject.js:89)
  </code></pre>
  
  <p>I get my data from a service that gets from a database. It functions just fine. What I mean is the functionality is right. I can do the paging it's just that I get this error in the inspector. Please see my code below:</p>
  
  <pre><code>ngOnInit() {
      if (this.genParams.buildingId === null || this.genParams.buildingId === undefined) {
        this.router.navigate(['/main/viewproperties']);
      }
  
      this.buildingId = this.genParams.buildingId;
      this.getUnits();
    }
  
   public getUnits() {
      this.isLoading = true;
      this.unitService.newGetUnits(this.buildingId)
        .subscribe((data: any) =&gt; {
          this.ELEMENT_DATA = data;
          this.dataSource = new MatTableDataSource(this.ELEMENT_DATA);
          this.dataSource.paginator = this.paginator;
          this.isLoading = false;
          console.log(this.ELEMENT_DATA);
        }, err =&gt; {
          console.log(err);
        });
    }
  </code></pre>
  
  <p>This is in my html:</p>
  
  <pre><code>&lt;mat-paginator [pageSizeOptions]="[1, 5, 10, 20]" showFirstLastButtons&gt;&lt;/mat-paginator&gt;
  </code></pre>
  
  <p>I would really appreciate your help.</p>