Javascript 如果工具提示模板在Angular2中为空，如何禁用NgbTooltip？

我在工具提示中显示了一组数据，所以我使用了一个模板。我的代码如下所示：

<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>

{{month.appliedMonthYear | utc |日期：'MM/y'}{{{last？''':'，'}}
月份：{{data.Months.length}

如果

data.months

为空，我不希望出现工具提示。当前，如果为空，则仅显示工具提示箭头

我曾尝试在模板内的

标记上添加

*ngIf

，但没有成功。我还尝试将

*ngIf

添加到

中，但没有效果。

简单的方法是

<div *ngIf='data.months.length > 0'>
    <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">Show Info</span>
</div>
<div *ngIf='data.months.length === 0'>
    <span>Show Info</span>
</div>

{{month.appliedMonthYear | utc |日期：'MM/y'}{{{last？''':'，'}}
显示信息
显示信息

好的，我终于能弄明白了。这是我必须做的

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

Months:{{data.Months.length}

您可以使用元素引用，如

#t=“ngbTooltip”

然后手动触发工具提示。在您的情况下，如果需要，可以使用它，或者根本不显示工具提示

<div
   [ngbTooltip]="(data.months?.length) ? ToolTipTemplate : ''"
  triggers="manual"
  #t="ngbTooltip"
  (mouseenter)="(data.months?.length) && t.open()"
  (mouseleave)="t.close()">
show Tooltip
</div>

显示工具提示

您可以使用

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

Months:{{data.Months.length}

---

有关更多信息，请参阅文档：

@Hoyen我尝试在

中使用*ngIf，但没有成功。请查看此问题-谢谢您的回答。我找到了一个使用更少代码的解决方案。您是否尝试过

禁用工具提示