0

私は素晴らしいjquery ズーム/パン ライブラリからディレクティブを作成しようとしています。テンプレートの要素にアクセスしてプラグインを初期化するにはどうすればよいですか?

現在、ディレクティブは次のようになっています。

    directive('zui', [function () {
    return {
        restrict: 'E',
        scope: { URL: "@"},
        template: '<div id="zui" ><div id="viewport" ><img ng-src="{{imageURL}}"></div></div>',
        link: function (scope, element, attrs) {
            scope.imageURL = URL;

            var zui = new ZUI53.Viewport( document.getElementById('zui') );
            zui.addSurface( new ZUI53.Surfaces.CSS( document.getElementById('viewport') ) );

            var pan_tool = new ZUI53.Tools.Pan(zui);
            zui.toolset.add( pan_tool );
            pan_tool.attach()
        }
    };
}]);

明らかdocument.getByID()に、これを達成する最善の方法ではありません。より良い解決策は何ですか？どうもありがとう。

4

1 に答える 1

1

を使用して要素に到達することdocument.getElementById('zui')は、実際には良くありません。ディレクティブのインスタンスを 2 つ持つ必要がある場合zui、それは壊れます。

  1. idルート要素では使用しないでください。などのマーカークラスclass="zui"または などのデータ属性を使用しdata-zuiます。

  2. jquery を使用すると、次のfindように使用して要素にアクセスできますelement.find('.zui')[0];。

于 2014-02-24T23:48:19.567 に答える