How to disable NgbTooltip if tooltip template is empty, in Angular2?

Question

I'm showing an array of data inside a tooltip, so I used a template. My code looks like:

<ng-template #ToolTipTemplate>
    <small *ngFor="let month of data.months; let first = first; let last = last"> {{ month.appliedMonthYear | utc | date:'MM/y' }}{{ last ? '' : ', ' }} </small>
</ng-template>

<span [ngbTooltip]="ToolTipTemplate">Months: {{data.months.length}}</span>

If data.months is empty I do not want the tooltip to appear. Currently if it's empty it shows the tooltip arrow only.

I've tried adding an *ngIf on the <small> tag inside the template, but that didn't work. I've also tried adding *ngIf into <ng-template> to no avail.

Answer 1

Ok, I was finally able to figure it out. Here's what I had to do

<span [ngbTooltip]="(data.months?.length) ? ToolTipTemplate : ''">Months: {{data.months.length}}</span>