6

templateUrlを持つ単純なAngularJS ディレクティブがあります。ディレクティブはツールチップ用です。

  • 現在、隠し要素を追加しています。ただし、ディレクティブは非常に頻繁に使用されるため、何百ものデータ <-> DOM バインディングが発生し、ページが使用不能になるまで速度が低下します。
  • 実際にテンプレートのみをロードし、マウスオーバー時に要素を追加したいと思います。

angular docs を読むと、ディレクティブを遅延レンダリングにする方法はないようです。何か不足していますか？

    

    // 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)
                    }
                });
            }
        }   
    }
4

1 に答える 1

1

$compileコールバック内で次のようなことを行うには、サービスを注入する必要があると思います。

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

これをあなたのコードに適合させるための正確な手順を考えていませんが、それが役立つかどうか教えてください.

于 2013-07-17T14:11:33.650 に答える