Forums Ignite UI for Angular
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Amit Kohli
30
Make tab active at run time
posted

Hello,

Below is the HTML setup for the tab component with a template reference variable #notes assigned to one of the tabs.

In the ngOnInit - for certain route parameters, would like to make one of the non-first tabs the active one e.g. -

ngOnInit() {
// debugger;
this.notes.select();
// this.notes.isSelected = true;
}

There is only one router-outlet for the application

<!-- operational\components\analyzer\analyzer.component.html -->
<div class="layout-box-container">
<div class="layout-box-top" igxLayout igxLayoutDir="row">
<span><a [routerLink]="''">Operational</a></span>
<span class="atitle">Analyzer Diagnostics</span>
</div><!-- /.layout-box-top -->

<div class="tabs" igxLayout igxLayoutDir="row" igxLayoutJustify="space-between">
<igx-tabs style="width: 100%">
<igx-tabs-group label="STREAM" name="stream">
<stream></stream>
</igx-tabs-group>

<igx-tabs-group label="NOTES" name="notes" #notes>
<notes></notes>
</igx-tabs-group>
</igx-tabs>
</div><!-- /.tabs -->
</div><!-- /.layout-box-container -->

Thanks and regards,

Amit Kohli