Tooltips are those text popups which when you hover some text or an image they appear over the text in a box usually with some text content, enabling you to give more information to the user on whatever it is your developing. These handy tools now have great browsers support and installing a chrome browser will obviously give you the best user experience as Google are constantly changing and updating their code to make it better.
Anyways, here are some options for Angular 2 Tooltips that you can use you in your angular application.
1. Angular2 Tooltip Directive
Tooltip provides a text label that is displayed with the user hovers over or longpresses an element. The tooltip can be displayed above, below, left, or right of the element.
2. angular2-tooltip
Customizable npm packaged Angular2 tooltip component. Place attribute tooltip on to any html element which you want to display a tool tip for.
3. ng2 ngx-tooltip
Simple tooltip control for your angular2 applications using bootstrap3. Does not depend of jquery. If you want to use it without bootstrap – simply create proper css classes.
4. Angular 2 Tooltip – Stars
Angular 2 tooltip to show additional information related to an element if a user mouse over this element. We can display the tooltip on top right bottom or left of an element. Angular 2 tooltip component is very useful.
5. Angular Material Tooltip
The Tooltip’s md-z-index attribute can be used to change the tooltip’s visual level in comparison with the other elements of the application. The Tooltip’s md-direction attribute can be used to dynamically change the direction of the tooltip. The Tooltip’s md-visible attribute can be used to programmatically show/hide itself. The Tooltip’s md-delay attribute can be used to delay the show animation.