Создать директиву AngularJS, которая не сразу отображается?

Question

У меня есть простой AngularJS directive with a templateUrl. Директива предназначена для всплывающей подсказки.

• В настоящее время я добавляю скрытый элемент. Однако директива используется очень часто, поэтому сотен данных < -> Связывание DOM происходит, и страница замедляется до степени непригодности к использованию.
• Я хотел бы только загрузить шаблон и добавить элементы при наведении указателя мыши.

Reading the angular docs, there doesn't seem to be any way of making a directive delay rendering. Я что-то упускаю?

// Tooltip directive 
    return function(){ 
     return { 
        templateUrl: 'someTemplate.html', 
        replace: false, // Append our tooltip, rather than replace the element's contents. 
      link: function (scope, element, attrs) { 
       $element.on({ 
         mouseenter: function() { 
          // Would like to render, and set up bindings, here (my question) 
        }, 
         mouseleave: function() { 
          // Destroy rendered element here (simple stuff, not my question) 
        } 
       }); 
      } 
     } 
    } 

Answer 1

Я полагаю, вы будете нуждаться в впрыскивать $compile услуги, чтобы сделать что-то вроде этого внутри обратного вызова:

templateMarkup = '<p> {{ property }} </p>'; 
$compile(templateMarkup)(scope); 

Я не продумана точных шагов, чтобы соответствовать этим в свой код, но дайте мне знать, если это будет полезно.