2014-01-14 3 views
0

내 AngularJS 응용 프로그램에서 #header 요소의 높이를 가져 오려고하지만 jQuery가 잘못된 높이를 반환하는 것으로 보입니다.요소의 잘못된 높이를 반환하는 jQuery

: 내 크롬의 개발 도구와 #header 요소를 강조에서 볼 수 있지만 그, 옳지 않아,

$(document).ready(function() { 
    function resizeCover() { 
     console.log($('#header').height()); 
    } 

    resizeCover(); 
}); 

콘솔에서, I 출력 20를 볼 수 있습니다 순간 코드는 기본적으로 구성 enter image description here

또한 outerHeight()을 사용해 보았지만 20 점도 반환했습니다.

<div id="header"> 
    <div class="container"> 
     <div id="logo"> 
      <a ng-href="/">Company Ltd</a> 
     </div> 

     <ng-include src="'/partials/global-shared/navigation.html'"></ng-include> 
    </div> 
</div> 

내가는 #logo 사업부가 #header의 높이를 확대해야한다 높이가 100 픽셀로 설정 될 때, 문제를 일으키는 것을 ng-include 생각하지 않습니다 다음과 같이

헤더 makrup입니다 .

jQuery가 요소 높이를 잘못 리턴 할 수있는 원인은 무엇입니까?

+3

높이가 계산 된 후 일부 내용이로드되기 때문일 수 있습니다. –

+0

원인은 타이밍 문제 (경쟁 조건) 또는 CSS 관련 또는 각도 관련 일 수 있습니다. 우리가 전체 그림을 가지고 있지 않다면 문제를 찾기가 어렵습니다. 바이올린이나 ** [SSCCE] (http://sscce.org) **를 준비하는 것은 확실히 도움이 될 것입니다 ... – gkalpak

+0

그래, 설치 바이올린 : http://jsfiddle.net/ 그럼 우리가 당신을 도울 수 있습니다 –

답변

1

각도를 사용 중이지만 높이 출력은 문서 준비 기능에 있습니다. 따라서 브라우저 콘솔은 ng-include가 실행되기 전에 헤더의 높이를 출력합니다.

ng-include가 실행 된 후 어딘가에 각도 app에 헤더 console.log 헤더를 넣으십시오.

관련 문제