2014-04-29 12 views
6

Ich habe ein Problem in der Hand in AngularJS und brauche einige Hinweise.Verwendung der externen URL in ng-include in AngularJS

Ich habe eine Ansicht, wo ich eine externe URL einbetten möchte (z. B. http://www.w3schools.com). Die eingebettete HTML-Seite sollte auf Ereignisse wie Klick und Berührung wie eine normale HTML-Seite reagieren.

Ich habe ng-include-Direktive verwendet, um das zu funktionieren.

ist hier ein Code-Schnipsel:

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

Wenn ich die externe html laden, ich bin die externe Webseite geladen bekommen, aber alle Links innerhalb der Seite sind gebrochen. Wenn ich auf einen Link in der geladenen Seite klicke, zeigen alle Links statt auf die externe URL jetzt auf localhost.

Wie kann ich dieses Problem beheben?

Vielen Dank im Voraus!

+0

Hallo, wenn das Problem wegen Cross-Domain-Zugriff ist, lassen Sie mich bitte wissen, wie ich es beheben kann. – Biswarup

+0

Die Links zeigen auf den lokalen Host, da die Links relativ sind und keine absoluten URLs bedeuten, es sei denn, alle Links auf dieser Seite haben die volle URL http://www.w3schools.com/about und nicht/über sie werden nicht funktionieren. Es wird auf Ihrem Server nach/ab suchen. Dies ist nicht, wie Include verwendet werden sollte, aber wenn Sie es auf diese Weise verwenden wollten, müssten Sie eine benutzerdefinierte Direktive erstellen, die zuerst ein $ http.get der URL ausführt und dann durch das HTML schaut und alle Links ersetzt von der Domäne, aus der sie kamen, absolut zu sein. – btm1

+0

Danke für die Eingabe. Gibt es eine andere Möglichkeit, wie ich ein Online-HTML in meine Seite einbetten kann, ohne die URLs zu ändern? Ich habe den Iframe-Ansatz versucht, aber in einem Iframe funktioniert die Berührung nicht. – Biswarup

Antwort

7

Es klingt wie Sie wollen nur die externe Website in Ihrer Sicht hosten, und dann sollten Sie es nur in einem iframe verknüpfen.

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

Wenn Sie etwas Magie/dynamische Sachen passieren wollen, müssen Sie den Inhalt und umschreiben die URLs zu analysieren, fügen Handler usw. Der Grund Ihrer ng-umfassen wie erwartet funktioniert nicht, weil es nur liest der Inhalt dieser URL und bettet es in Ihre Ansicht "als wenn" es nur eine Vorlage war, die Sie gemacht (einschließlich eckige Markup) und wollte aus irgendeinem Grund extern hosten.

Verwandte Themen