ViewChild doesn't work to me - upgrade to beta7

import {Page,NavController,NavParams,Platform,IonicApp} from 'ionic-angular';
import {ViewChild} from '@angular/core';

    templateUrl: 'build/pages/tabspage/tabspage.html'

@ViewChild('myTabs') tabRef: Tabs

export class TabsPage {

     constructor(app:IonicApp, params:NavParams) {
        this.tab1 = Page1;
        this.tab2 = Page2;
        this.tab3 = Page3;


     onPageDidEnter() {;


I have this code. This code is inside of a typescript file. I get the error: Error TS1146: Declaration expected.

Why are all three tabs Page1? Why aren’t you using selectedIndex on the <ion-tabs> element?

IMHO, 9 times out of 10 that you are messing around with the DOM from inside controller code, you have a fundamental design flaw.

@rapropos I stripped down by code for this question. It should be Page1, Page2, Page3

Hi ,
I think you don’t need import IonicApp any more,
because Viewchild directive is a safer way to get a component.

If you start a new @beta7 project the tab page come like this:

and you can use selectedIndex as rapropos says,

and pass in the contructor

anyway this might be helpful too


I found the issue for this. My @ViewChild(‘myTabs’) tabRef: Tabs was OUTSIDE of the class definition, it should be inside of the class definition.