Ist es möglich angularjs Ausdrücke in einem iframe zu aktualisieren?

8

Also ... zum Beispiel versuche ich eine E-Mail "Vorlage" in einen Iframe als "Vorschau" für den Benutzer innerhalb einer angularjs App einzutragen. Der Iframe befindet sich im Controller-Bereich (nennen wir ihn MainCtrl). Der Benutzer wäre dann in der Lage, anhand der in MainCtrl bereitgestellten Formularelemente die Vorschau basierend auf ihrer Eingabe zu aktualisieren. Nehmen wir zum Beispiel an, dass unsere Vorlage, die in den Iframe gezogen wird, ungefähr so ​​aussieht:

%Vor%

In unserer index.html (angularjs-App) würden also Formularelemente an {{header}} und {{body}} ...

gebunden sein %Vor%

ist das möglich? Ist es möglich, dass angularjs diese Informationen aktualisiert, und wenn ja, wie? Ich habe etwas ähnliches Setup und scheint, dass es nicht funktioniert. Ich kann nicht die angularjs Ausdrücke zum Auswerten bekommen ... alles was auftaucht ist {{body}}, etc ...

    
kevindeleon 01.10.2013, 21:04
quelle

2 Antworten

12

Wenn Sie den iframe und das übergeordnete Dokument vom selben Domänennamen ausführen (so dass keine Cross-Site-Scripting-Einschränkungen gelten), können Sie eine JavaScript-Funktion im iframe aufrufen, die Sie weitergeben können.

Was Ihnen möglicherweise fehlt, ist, dass der iframe ein separates Dokument aus der Sicht des Browsers ist. Wenn also dieser Iframe den AngularJS-Code ausführen soll, müssen Sie eine separate AngularJS-Anwendung erstellen.

Hier ist ein Beispiel, in dem sowohl das übergeordnete Dokument als auch der iframe separate AngularJS-Anwendungen sind und der Wert einer Texteingabe im übergeordneten Element bei Änderung an den iframe gesendet wird, wo die dort laufende AngularJS-Anwendung die Daten in den Bereich legt.

Zypern

    
Juliane Holzt 01.10.2013, 21:30
quelle
0

Aus der Sicht des Browsers gibt es nichts Besonderes an eckigen - das ist Javascript, das ist alles was zählt. Also würde ich sagen, die Antwort auf Ihre Fragen ist - ja, es sollte funktionieren.

Natürlich gelten die Beschränkungen der gleichen Herkunftsrichtlinie. Auch asynchronicity kann einige Probleme verursachen, aber anders als das sollte es nur funktionieren

    
mfeingold 01.10.2013 21:07
quelle

Tags und Links