избежать мерцания в поповер директивы

Question

Эта простая функция директива:

function popoverHelp() { 
    return { 
     restrict: 'E', 
     scope: { 
      title: '@', 
      text: '@' 
     }, 
     templateUrl: 'popoverHelp.html' 
    }; 

С этим шаблоном:

<i class="fa fa-question-circle" popover="{{::text}}" popover-placement="top" 
popover-title="{{::title}}" popover-trigger="mouseenter"></i> 

вызывает мерцание при первой отображается подсказка. Тот же HTML со статическим текстом и никакой директивой не мерцает заметно.

• Хром: незначительное мерцание.
• Firefox: popover появляется в разных положениях.
• IE 11: всплывающее окно включается и выключается.

Добавление ng-cloak не имеет значения.

Как уменьшить или устранить мерцание и использовать шаблон?

Update:

В соответствии с просьбой, я попытался создать Plunk для этого. К сожалению, я не смог воспроизвести проблему там, и popover значительно отличается от того, который я вижу в нашем производственном приложении.

Answer 1

Учитывая, что проблема не может быть реплицирована в созданном Plunk, поэтому нам не удастся увидеть или устранить проблему. Самое простое решение, которое я вижу, чтобы избежать мерцания, было бы использовать Angular UI.

Директива Popover у них проста, и вы уже используете угловые и бутстрапы. Я хотел бы посмотреть на dynamicPopover создана, это будет что-то вроде этого:

<i class="fa fa-question-circle" uib-popover-template="dynamicPopover.templateUrl" popover-trigger="mouseenter"></i> 

Это также должно помочь стандартизировать внешний вид всплывающего окна в различных браузерах.