I am using "ngb-tabset" to display tabs in the angular2. I am trying to add 
an event to a tab like below:
<ngb-tabset>
<ngb-tab title="Profile" (click)="callMyFunction()">
</ngb-tab>
<ngb-tabset>
I can't figure out why the above click function is not calling my function.
Can someone please help?
Thanks!
Anil Mathew 's gravatar image asked Jan 11 2017 at 10:20 in Angularjs by Anil Mathew

2 Answers

Hi Anil,
Did you define "callMyFunction" on the ngb-tab-title components controller?
If not, the click is probably handled by the ngb tabs system.
you can add your own clickhandler inside a ngbTabTitle template like this:
<ngb-tabset>
<template ngbTabTitle> <span (click)="callMyFunction()">Profile
</span></template>
<ngb-tabset>
As documented in the excellent ngBootstrap documentation!
Regards
Sander
Sander Elias 's gravatar image answered Jan 11 2017 at 20:43 by Sander Elias
Thank you Sanders!
In fact the issue was the event name. i.e it should like below:
<ngb-tabset (tabChange)="getStudentGrades()">
And I was trying with (change), (click) etc..
Anil
Anil Mathew 's gravatar image answered Jan 12 2017 at 12:08 by Anil Mathew