2014-04-29 5 views
6

저는 AngularJS에 문제가있어서 몇 가지 지침이 필요합니다.AngularJS에서 ng-include에 외부 URL 사용

외부 URL을 삽입하려는 위치가 있습니다 (예 : http://www.w3schools.com). embeded html 페이지는 정상적인 html 페이지처럼 클릭하고 만지는 것과 같은 이벤트에 응답해야합니다.

ng-include 지시문을 사용하여 작동하도록했습니다. 여기

는 코드입니다 : 내가 외부 HTML을로드하면

<ion-content> 
     <div ng-include src="'http://www.w3schools.com'"</div> 
    </ion-content> 

, 내가로드 외부 웹 페이지를 얻고 있지만, 페이지 내부의 모든 링크가 끊어집니다. 로드 된 페이지 내의 링크를 클릭하면 모든 링크가 외부 URL 대신 localhost를 가리 킵니다.

이 문제를 어떻게 해결할 수 있습니까?

감사합니다.

+0

안녕하세요, 도메인 간 액세스로 인해 문제가 발생한 경우 어떻게 해결할 수 있는지 알려주세요. – Biswarup

+0

링크가 상대 URL이고 절대 URL이 아니기 때문에 링크는 로컬 호스트를 가리 킵니다. 해당 페이지의 모든 링크에 http://www.w3schools.com/about이라는 전체 URL이 있어야 작동하지 않을 것입니다. 그것은 귀하의 서버에서/about을 찾습니다. 이것은 include가 사용되는 방법이 아니지만이 방법으로 사용하려는 경우 URL의 $ http.get을 먼저 실행 한 다음 html을보고 모든 링크를 대체하는 사용자 정의 지시문을 작성해야합니다 그들이 나온 도메인으로부터 절대적이어야합니다. – btm1

+0

입력 해 주셔서 감사합니다. 내 페이지 안에 URL을 변경하지 않고 온라인 HTML을 삽입 할 수있는 다른 방법이 있습니까? iframe 접근 방식을 시도했지만 iframe에서 터치가 작동하지 않습니다. – Biswarup

답변

7

당신은 실제로보기 내부에 외부 사이트를 호스트하려는 것처럼 들리지만, 그러면 iframe에서 링크해야합니다. 그것은 단지 읽기 때문에

<iframe src="http://www.w3schools.com"></iframe> 

당신이 뭔가 마법/동적 물건을 발생하려면, 당신은 핸들러의 내용을 분석하고 URL을 다시 작성, 첨부해야합니다 등 당신의 예상처럼 작동하지 않습니다 NG가-포함하는 이유는 그 URL의 내용을 "as-if"로 작성하여 (앵귤러 마크 업을 포함하여) 만든 템플릿 일 뿐이며 외부에서 어떤 이유로 든 호스팅하고 싶었습니다.