Nativescript-angular: How to programmatically select a tab?

Created on 29 Mar 2016  路  3Comments  路  Source: NativeScript/nativescript-angular

The method described here is not working with angular, maybe I need a way to reference the TabView component, any idea? I just need to change to a specific tab on a function call, but maybe this is a bigger issue.

Most helpful comment

Since I also stucked on this, I would like to share the way I handled this:
I could get the tabview reference through frameModule. Using frameModule.topmost() you will get the reference to the current frame that is inside a , and then by using "parent.parent" you will get the element.
xml
<TabView> <TabViewItem> <Frame defaultPage="your page route"></Frame> </TabViewItem> </TabView>
js
const frameModule = require('tns-core-modules/ui/frame'); const tabView = frameModule.topmost().parent.parent; tabView.selectedIndex = n; //change actual active tab

All 3 comments

You should be able to name your TabView as in <TabView #myTab>, and then use a @ViewChild field decorator to obtain an Angular ElementRef which in turn will contain a reference to the native TabView element.

Related to #141

Thanks Hristo, that helped a lot. I wasn't thinking that would work because there is no DOM, but it does.

Since I also stucked on this, I would like to share the way I handled this:
I could get the tabview reference through frameModule. Using frameModule.topmost() you will get the reference to the current frame that is inside a , and then by using "parent.parent" you will get the element.
xml
<TabView> <TabViewItem> <Frame defaultPage="your page route"></Frame> </TabViewItem> </TabView>
js
const frameModule = require('tns-core-modules/ui/frame'); const tabView = frameModule.topmost().parent.parent; tabView.selectedIndex = n; //change actual active tab

Was this page helpful?
0 / 5 - 0 ratings