change OnInit to AfterViewInit to load MatSort before http table request (#11122)

Author: butterprim

src/material-examples/table-http/table-http-example.ts

@@ -1,5 +1,5 @@
 import {HttpClient} from '@angular/common/http';
-import {Component, OnInit, ViewChild} from '@angular/core';
+import {AfterViewInit, Component, ViewChild} from '@angular/core';
 import {MatPaginator, MatSort, MatTableDataSource} from '@angular/material';
 import {merge, Observable, of as observableOf} from 'rxjs';
 import {catchError, map, startWith, switchMap} from 'rxjs/operators';
@@ -12,7 +12,7 @@ import {catchError, map, startWith, switchMap} from 'rxjs/operators';
   styleUrls: ['table-http-example.css'],
   templateUrl: 'table-http-example.html',
 })
-export class TableHttpExample implements OnInit {
+export class TableHttpExample implements AfterViewInit {
   displayedColumns = ['created', 'state', 'number', 'title'];
   exampleDatabase: ExampleHttpDao | null;
   dataSource = new MatTableDataSource();
@@ -26,7 +26,7 @@ export class TableHttpExample implements OnInit {
 
   constructor(private http: HttpClient) {}
 
-  ngOnInit() {
+  ngAfterViewInit() {
     this.exampleDatabase = new ExampleHttpDao(this.http);
 
     // If the user changes the sort order, reset back to the first page.