-2

I have an element with a text that shows a tooltip when the text is truncated. I want to remove the tooltip when the element's text is no longer truncated. The problem is I can't get to the event of the tooltip. I add the tooltip by setting the attribute to the element on truncation. However, removing the attribute doesn't remove the event and the tooltip still shows up. I am using Angular bootstrap tooltip. I searched the internet and removeEventListener() didn't help because I don't have the tooltip event handler. The only workaround I was able to use and worked is triggering the event mouseleave on the element which hid the tooltip, not removed it. I think this is not a good way of doing it, I need to remove that event. By the way, I am using angular and javascript only, no jQuery.

Any ideas how to do this?

Edit: My element is like this:

<span>Here goes the text</span>

and after adding the tooltip the element looks like this

<span uib-tooltip="Here goes the text" tooltip-append-to-body="true" tooltip-placement="bottom">Here goes the text</span>

1 Answers1

0

You should provide tooltip-enable expression in attributes which will return if text is truncated or not. This can be easily determined like so: https://stackoverflow.com/a/143889/2337927. Keep in mind though that you can't use DOM elements directly in angular expressions due to security issues. What you want to do is for example register isTextOverflowing function on controller and call it from the expression: tooltip-enable="vm.isTextOverflowing()"

Edit

If you are positive that what you want is to remove event listener completely then I'm afraid that will involve writing a decorator but in really messy (or even hacky) way but if what you're up to is simply closing the tooltip when text becomes fully visible it's easy to accomplish using combination of tooltip-enable and tooltip-is-open such as shown in this plunk.

Community
  • 1
  • 1
Bartosz Gościński
  • 1,468
  • 1
  • 16
  • 28
  • I am giving you a useful answer because your answer is good but it is not what I am looking for. I need to remove the event attached to that element if that's possible. –  Sep 01 '16 at 05:20
  • By removing the event you mean removing event listener or closing the tooltip when text becomes fully visible (not truncated)? – Bartosz Gościński Sep 01 '16 at 13:35