nb-tabset lazyLoad and (changeTab) not working

[maihannijat]

Issue type

I'm submitting a ... (check one with "x")

• [x ] bug report
• feature request

Issue description

I have nb-tabset with two tabs and one component in each tab. I want to lazy load the second component. The second component makes API call and I want to make that only if user clicks on the tab or the tab become active. The [lazyLoad]="{{true}}" or lazyLoad decorators do not work. Tried (changeTab) event or (click) but these do not fire either.

Current behavior:
lazyLoad loads component instantly.
(changeTab) and click do not fire.

Expected behavior:
lazyLoad loads content when the tab is active and (changeTab) and (click) events should fire.

Related code:

<nb-tab tabTitle="Map">
  <div class="row">
    <div class="col-md-6">
      <app-field-info></app-field-info>
      <app-field-forecast></app-field-forecast>
    </div>
    <div class="col-md-6">
      <app-map></app-map>
    </div>
  </div>
</nb-tab>
<nb-tab tabTitle="Calendar" (changeTab)="displayCalendar()" lazyLoad>
  <app-calendar *ngIf="isCalendarActive"></app-calendar>
</nb-tab>
</nb-tabset>

Other information:

Angular, Nebular

Angular 8 and Nebular 4.1.2

[alexandr-efimov]

looks like it is still actual :(