How to get the witdh of a responsive grid element with Ion-side-menu = large?

1

Hello,

Here is the codepen :
http://codepen.io/ronyrun/pen/zxVePR

I’m trying to get the width value of a grid element but I don’t get the proper value look :

image
Ion-side-menu-get-width-grid.png2560×1298 285 KB

2

Try using this directive:

.directive('divWidth', function() {
  return {
    restrict: 'A',
    link: function(scope, element, attrs) {
      scope.$watch(function() {
        return element[0].clientWidth;
      }, function(newWidth, oldWidth) {
        scope.widtha = newWidth;
      });
    }
  }
})

<div div-width></div>

Not sure if this is the best option but it updates its width. You get the width + margin of the element.

1 Like
3

the solution :

On IRC : Bodin-

Ronyrun, guess the opening of the sidemenu runs later than your controller code. You can wrap your code within a $timeout to get the correct values, like so: http://codepen.io/anon/pen/OPedaM