Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to show the tooltip with bootstrap 4 and angular 2?

I want to show the tool-tip for input field based on the condition and here is the following code snippet I have used. i want to display tool-tip based on a specific variable.

<input type="text" class="form-control error-tooltip"
    focusFirst="false" ngbTooltip="{{error}}" 
    placement="bottom"
    triggers="manual" #t="ngbTooltip">
like image 789
BHARAT ATHOTA Avatar asked Feb 27 '17 09:02

BHARAT ATHOTA


1 Answers

in your Template:

 <input type="text" class="form-control" formControlName="name" placeholder="placeholder" ngbTooltip="tipContent" #t="ngbTooltip" >

in your controller:

@ViewChild('t') tooltip: NgbTooltip;

in your method to open, like submit :

this.tooltip.open();

make sure jo load the modules and import NgbTooltip

See example, Context and manual triggers, in the doc: https://ng-bootstrap.github.io/#/components/tooltip/examples

like image 107
newan Avatar answered Oct 12 '22 23:10

newan