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(); }); }; });
Comments
Post a Comment