Angularjs - Call Directive when remodeling page

Question

I have a Directive that determines the size and width of some elements, but when I change the page dimension it doesn’t fit. I would like a way that when the user changes the dimensions of your browser the angular will call Directive again.

Answer 1

You can use $watch, as in this example:

 app.directive('myDirective', ['$window', function ($window) {

     return {
        link: link,
        restrict: 'E',
        template: '<div>window size: {{width}}px</div>'
     };

     function link(scope, element, attrs){

       scope.width = $window.innerWidth;

       angular.element($window).bind('resize', function(){

         scope.width = $window.innerWidth;

         // manuall $digest required as resize event
         // is outside of angular
         scope.$digest();
       });

     }
 }]);

Example cited https://stackoverflow.com/questions/31622673/angularjs-watch-window-resize-inside-directive