条件下的Popover / tooltip ui引导程序角度为6

Question

我必须在某些条件下打开弹出窗口。我怎样才能做到这一点？

  <div class="btn btn-outline-secondary" *ngFor="let category of categories"
  [ngbPopover]="tipContent"
  popoverClass="change-category-info"
  placement="bottom"
  tooltipClass="change-category-tooltip">{{category}}</div>

在此实现中，单击后始终会打开弹出窗口。我想在某些情况下（例如，如果     this.isChanged = true

Answer 1

您可以使用triggers="manual"输入来完全控制弹出窗口。

<button ... triggers="manual" #p="ngbPopover" (click)="isChanged && p.open()">
  Popover on right
</button>

Stackblitz Example

Example with ngFor

另请参阅：

• https://ng-bootstrap.github.io/#/components/popover/examples#triggers

Answer 2

您可以使用 disablePopover 输入来阻止显示弹出框，如 API documentation 中所述。

假设 isChanged 是组件中的公共属性，它看起来像这样：

  <div class="btn btn-outline-secondary" 
       *ngFor="let category of categories"
       [ngbPopover]="tipContent"
       popoverClass="change-category-info"
       placement="bottom"
       tooltipClass="change-category-tooltip"
       [disablePopover]="!isChanged">{{category}}</div>