title: Typescript error: @viewChild undefined
body: <p>Tried using the select() method in tabs.ts from the Ionic Tabs documentation. But it seems that when I tried running it, it says that "select is undefined" and I found out that my viewChild is actually empty/undefined when I tried console.log(tabs). Tried searching for the reason why viewChild is undefined but could not really understand why.</p>
  
  <p>Link to ionic tabs documentation:
  <a href="https://ionicframework.com/docs/api/components/tabs/Tabs/" rel="noreferrer">https://ionicframework.com/docs/api/components/tabs/Tabs/</a></p>
  
  <p>tabs.html</p>
  
  <pre><code>&lt;ion-tabs #tabs&gt;
    &lt;ion-tab [root]="tab1Root" tabTitle="Request" tabIcon="alert"&gt;&lt;/ion-tab&gt;
    &lt;ion-tab [root]="tab2Root" [rootParams]="detailParam" tabTitle="Pending" 
     tabIcon="repeat"&gt;&lt;/ion-tab&gt;
    &lt;ion-tab [root]="tab3Root" tabTitle="Completed" tabIcon="done-all"&gt;&lt;/ion-
     tab&gt;
    &lt;ion-tab [root]="tab4Root" tabTitle="Profile" tabIcon="person"&gt;&lt;/ion-tab&gt;  
  &lt;/ion-tabs&gt;
  </code></pre>
  
  <p>tabs.ts</p>
  
  <pre><code>import { Component, ViewChild } from '@angular/core';
  import { NavController, NavParams, AlertController, Tabs } from 'ionic-
  angular';
  import { PendingJobPage } from '../pending-job/pending-job';
  import { CompletedJobPage } from '../completed-job/completed-job';
  import { RequestPage } from '../request/request';
  import { ProfilePage } from '../profile/profile';
  
  @Component({
    templateUrl: 'tabs.html'
  })
  export class TabsPage {
  
    @ViewChild('tabs') tabRef: Tabs;
    pending: any;
    apply: boolean;
    detailsParam: any;
  
    tab1Root = RequestPage;
    tab2Root = PendingJobPage;
    tab3Root = CompletedJobPage;
    tab4Root = ProfilePage;
  
    constructor(public navParams: NavParams, public navCtrl: NavController) {
      this.pending = this.navParams.get('param1');
      this.apply = this.navParams.get('apply');
      this.detailsParam = this.navParams.data;
      console.log("a = ", this.tabRef);
  
      if(this.apply === true){
        this.navCtrl.parent.select(1);
      }
      else{
        this.navCtrl.parent.select(0);
      }
    }
  }
  </code></pre>