ViewChild doesn't work to me - upgrade to beta7

[polska03]

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

@Page({
    templateUrl: 'build/pages/tabspage/tabspage.html'
})

@ViewChild('myTabs') tabRef: Tabs

export class TabsPage {
     tab1;
     tab2;
     tab3;

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

     }


     onPageDidEnter() {
         this.tabRef.select(1);
      }

}

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

[rapropos]

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.

[polska03]

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

[jmbc]

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

Open Tab from Button (inside another Tab)

Alright guyz. This was the thing I was struggling for AGES. Let me clear up that for you. First you need to know how to get components from ionic. constructor( public app: IonicApp, ) { this.app = app; } ngAfterViewInit() { // Here 'my-content' is the ID of my ion-content this.content = this.app.getComponent('my-tab'); console.log("Yo we get the tab", this.content); } After you get the tab. You can all the glory functions --> Liike this.content.select(0);

cheers

[polska03]

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.