3

Bootstrap によってサイズが変更され、カスタム ディレクティブ myDirective1 で注釈が付けられた要素があります。

<div class="span4" myDirective1>Hello, world</div>

ディレクティブのリンク関数内で、ユーザーが開始したブラウザー ウィンドウのサイズ変更などによって、要素の幅がいつ変更されたかを知るために登録したいと考えています。

element.bind("resize", function() {
    console.log("Resized");

    // Do other stuff
});

Bootstrap の「container-fluid」および「row-fluid」クラスを使用しているため、視覚的には、要素は期待どおりに動的にサイズ変更されています。ただし、DOM の「サイズ変更」イベント用に設定したバインディングは起動しないようです。「要素」が実際に問題の予想される要素であることを確認しました。

完全なjQueryなしでこれを行っているので、AngularのJQLiteを使用しているだけです。

何か不足していますか？

4

2 に答える 2

1

完全な jquery を参照すると、興味深いオプションがいくつかあります。

違いを示すために rGils plunker をフォークしました。http://plnkr.co/edit/r6i3Y7tXeWNCp1r3LvYq?p=preview

基本的に、この構文を使用して必要なものを取得できます。

var resizeHandler = function(){
    //code goes here.
    //added as a var instead of inline so it can be turned off later.
};
$(window).on('resize.sizer', resizeHandler);

'resize' はイベント、'sizer' はディレクティブです。

また、これを行っている場所とアプリによっては、このイベント ハンドラーを削除したい場合があります...たとえば、ディレクティブが ng-if'd out である場合は、次を追加する必要があります。

scope.$on('$destroy', $(window).off('resize.resizer', resizeHandler);
于 2013-11-22T19:57:15.460 に答える