5

スパン内のテキストを変更した後、jQuery のresizeイベントを で発生させるのに問題があります。span

spanAngularJS ディレクティブを使用して、要素にイベント ハンドラーを適用しています。

angular.module("test.directives", [])
    .directive("trackSize", ["$parse", function($parse) {
        return function(scope, element, attrs) {
            function callback() {
                var size = { w: element.width(), h: element.height() };
                scope[attrs.trackSize].call(scope, size);
            }
            element.on("resize", function() {
                console.log("resize");
                scope.$apply(callback);
            });
            callback();
        };
    }]);

しかし、内部のテキストが変更されたときにコールバックが発生することはありませんspan。関連がある場合: テキストは、埋め込まれた AngularJS 式を使用して変更されています。

私の実際の (完全な) コード スニペットは、http: //jsfiddle.net/KkctU/13/の jsFiddle で見ることができます。

4

1 に答える 1

3

サイズ変更イベントは、スパンのようなドキュメント内の要素を対象としたものではありません。窓のみに使用するように作られています。

ここに役立つプラグインがあります。私はそれを使用していませんが、それはあなたにとって正しい軌道に沿っているようです.

ただし、最終的には、ディレクティブにバインドされているものにウォッチを設定し、テキストが変更されたときに高さと幅が変更されたかどうかを確認する方が良い/簡単な場合があります。アイデアとして：

app.directive('trackSize', function () {
   return function(scope, element, attrs) {
       var w = element.width(),
           h = element.height();
       scope.$watch(attrs.trackSize, function(v) {
           element.text(v);
           var w2 = element.width(),
               h2 = element.height();
           if(w != w2 || h != h2) {
              //TODO: do something here, the size has changed.
           }           
       });
   }
});
于 2013-02-03T05:55:11.480 に答える