TabView selectedIndex change from Child component


I have an app with a TabView component,
Can the tabSelectedIndex value be changed from within a child component?

The content of each tab is sourced using the routing.

The main html

<TabView #tabViewHome [(ngModel)]="tabSelectedIndex" (selectedIndexChange)="onIndexChanged($event)" selectedColor="#d8292f">
    <ng-template tabItem title="Dashboard" iconSource="{{dashActive === true ? 'res://dashboard' : 'res://dashboard'}}" >
    <router-outlet name="dashoutlet"></router-outlet>
    <ng-template tabItem title="Properties" iconSource="{{propActive === true ? 'res://properties' : 'res://properties'}}">
    <router-outlet name="propoutlet"></router-outlet>

I have a button in one of the components that loads content into another router-outlet.
I need this to then update the selected tab of the TabView.


You can always access frame and current page globally from frame module.

import * as frame form "ui/frame";
const page = frame.topmost().currentPage;
// from page you can traverse down to any component

If you prefer more angular way of doing it, you may use @Inject to inject parent component into child component Or pass parent instance as @Input to child Or you can even use ViewContainerRef.


Thank you for your response.

I managed to get it to work using @Inject