Geek asks and answers

AngularJS / jQuery: changing text in span doesn't cause resizing

I had a problem running jQuery resizefor an event spanafter I changed the text within the range.

I apply event handlers to an element spanusing the AngularJS directive:

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();
        };
    }]);

but I don’t see the fire of the callback when the text inside spanchanges. If it matters: the text is modified using the built-in AngularJS expression.

My actual (complete) code snippet can be seen on jsFiddle at: http://jsfiddle.net/KkctU/13/

+5
source share
1 answer

, span. .

, . , , , .

, , / , , , . :

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.
           }           
       });
   }
});
+3

More articles:


All Articles