javascript - angularJS window resize issue -


so somehow made memory leak in js. continously resized window of page, , buum, 86% memory usage. out of 16gbs of memory. after shut down had restart pc because still said 72% usage. system takes 17%.

so don't understand whats happening there, wanted somehow react when user resizes window because i'd change layout if width less 640px instance.

but yea here code.

index.html:

<div id="wrapper" ng-controller="appctrl" resize>     <div class="left-side" ng-class="{ fullw: smallr }">random content</div>     <div class="right-side" ng-class"={ fullw: smallr }">random content2</div> </div> 

the idea , have left , right side, after screen width below 640px, push them under each other attaching .fullw { width: 100% } style them.

my directive:

.directive('resize', function ($window) { return function (scope, element, attr) {      var w = angular.element($window);     scope.$watch(function () {         return {             'h': w.height(),              'w': w.width()         };     }, function (newvalue, oldvalue) {         if(newvalue.w <= 640) {             scope.smallr = 1;         } else {             scope.smallr = 0;         }     }, true);      w.bind('resize', function () {         scope.$apply();     }); }; }) 

its working if start play resizing day long, starts use tremendeous amount of ram...

thanks in advance

you should use css media queries task. simple rule in case:

.fullw {     width: 100px; }     @media (min-width: 640px) {     .fullw {         width: 100%;     } } 

demo: http://plnkr.co/edit/js7j5oae1lsshnsakvdc?p=preview

or if still want use power of angular directive, remove $watch part, don't need it, brings unnecessary overhead:

.directive('resize', function($window) {     return function(scope, element, attr) {         var w = angular.element($window);         w.on('resize', function() {             scope.smallr = w.width() <= 640 ? 0 : 1;             scope.$apply();         });     }; }); 

demo: http://plnkr.co/edit/6l3nlpb6g0bbodepxqjj?p=preview


Comments

Popular posts from this blog

c++ - QTextObjectInterface with Qml TextEdit (QQuickTextEdit) -

javascript - angular ng-required radio button not toggling required off in firefox 33, OK in chrome -

xcode - Swift Playground - Files are not readable -