CODEWITHSUNDEEP
angularng-bootstrap
Jim Showalter
Jim Showalter

Reputation: 550

ng-bootstrap not displaying tooltip despite following instructions in other answers to this question

In https://github.com/jimshowalter/vocabutron/blob/master/src/app/add-word/add-word.component.html. Following the instructions in the answer to ng-bootstrap not displaying tooltip doesn't work. It must be something stupidly obvious, but I don't see it.

Upvotes: 0

Views: 720

Answers (1)

Learning
Learning

Reputation: 1413

It is showing the tooltip with 'opacity:0', so it is invisible to our eyes. Add 'tooltipClass' property and add 'opacity: 1;' to that class. For example:

add-word.component.html:

  <button type="submit" class="btn btn-success" [disabled]="!wordForm.form.valid" placement="bottom" ngbTooltip="Use this to add word to learn later" tooltipClass="opacity-1">Learn Later</button>
  <button type="submit" class="btn btn-success" [disabled]="!wordForm.form.valid" (click)="learn()" placement="bottom" ngbTooltip="Use this to add word you've already learned" tooltipClass="opacity-1">I've Learned It</button>

styles.css:

.opacity-1 { opacity: 1; }

Upvotes: 1

Related Questions