2014-11-24 6 views
0

창 높이를 변경하고 요소에 대한 새 값을 설정하는 기능이 있습니다 (매우 복잡함 - 너무 높으면 스크롤을 추가/업데이트하고 높이가 높지 않으면 고정 높이로 유지됨).). 창 크기를 조정할 때 제대로 작동하지만 처음에는 제대로 작동하지 않습니다. 그래서, 여기에 질문 :로드 후 바로 작동하게 만드는 방법은 무엇입니까?초기 창 크기/캐칭 크기 조정

angular.module('main') 
    .directive('blablaRightColumnViewPort', ['$window', 
     function($window, $timeout) { 

      var directive = {}; 
      directive.restrict = 'A'; 

      directive.compile = function(element, attributes) { 

       // DOM references 
       var w = angular.element($window),... 
        maxHeight = 0; 

       function fitScroll() { 
        // count max height available 
        maxHeight = ...; 

        // compare an original size of the content to max available 
        if (originalElementHeight > maxHeight) { 
         element.height(maxHeight); 
        } else { 
         element.height(originalElementHeight); 
        } 
       } 

       return function(scope, element, attributes) { 

        // watch it! 
        scope.$watch(function() { 
         return w.height(); 
        }, function(){ 
         ... 
         fitScroll(); 

        }); 

        // assign the event 
        w.bind('resize', function() { 
         scope.$apply(); 
        }); 
       } 
      } 

      return directive; 
     } 
    ]); 

나는 컴파일에 사용하려 :

   $timeout(function(){ 
        w.resize(); 
       }, 0); 

및 링크 :

   $timeout(function(){ 
        scope.$apply(); 
       }, 0); 

전혀 작동하지 않았다을 ... 당황, 좌절.

답변

1

"성능 함수의 반환 값"패턴이 성능에 영향을 미치지 않도록하는 것이 좋습니다. 그냥 resize 이벤트에 바인딩하고 처음에는 함수를 트리거하지 않는 이유는 무엇입니까?

fitScroll(); 
angular.element($window).$on('resize', function() { 
    scope.$apply(fitScroll); 
});