2016-06-21 1 views
2

저는 (는) 자바 스크립트로 작성되었습니다. header.html 파일에 공통 헤더가있는 간단한 웹 사이트를 만들고 ng-include가 포함 된 사이트의 각 페이지에 포함 시켰습니다.header.html에 ng-include가 추가됨 늦게

제 문제는 페이지의 내용이 먼저로드 된 다음 나머지 페이지가 푸시되는 문제입니다. 먼저로드 할 헤더를 만드는 방법이 있습니까?

감사

편집 : 나는 또한 같은 문제가있는 바닥 글을 포함합니다.

+1

당신이 jsfiddle 또는' –

+0

쉽게 디버깅 할 수 codepen 만들 수 있습니다 헤드 섹션에서 각도에 refrence를 넣을 수 있습니다 발견 ng-include'는 비동기이며, 때로는 주요 내용 뒤에로드 할 수 있습니다. 일반적인 해결책은'run' 블록에 템플릿을로드하고 템플릿을 템플릿 캐시에 삽입하는 것입니다. https://docs.angularjs.org/api/ng/service/$templateCache#!/ – Claies

답변

-1

PHP를 통해 헤더를 추가하려고 했습니까?

<?php include 'header.html'; ?> 

나는 내 웹 사이트에서 가장 효율적인 방법을 찾았으며 바닥 글과 동일하게 수행했습니다.

는 다음

<div ng-include src="'views/header.html'"></div> 

하고 응용 프로그램의 나머지 부분을 헤더 형태로 외부보기를로드 할 수 있습니다

+0

이것은 angular.js에 대한 해결책이 아닙니다. Angular는 PHP 서버뿐만 아니라 많은 플랫폼에서 실행할 수 있습니다. 문제는 서버 측 옵션이 아니라 클라이언트 측 옵션에 관한 것입니다. – Claies

+0

나는 서버 측없이 웹 사이트를 만들고있다. 머리말과 꼬리말 파일을 포함시키는 것만으로도 가치가 있습니까? – JuanLanuza

0

, 당신은

+0

ng-include가 작동합니다. 문제는 페이지의 주요 콘텐츠가 먼저로드되고 헤더가 표시되면 페이지의 나머지 부분을 푸시 다운하는 것입니다. – JuanLanuza

+0

헤더가로드 된 후 각도 모듈을 수동으로 초기화 할 수 있습니다. [여기] (https://docs.angularjs.org/guide/bootstrap) – abdoutelb