AngularJS: Element nicht gefunden über getElementById

Question

Ich verwende eine Funktion einer JavaScript-Anwendung von Drittanbietern, die ich in eine meiner AngularJS-Fabriken einbeziehe. Ein Parameter dieser Funktion ist die ID eines DOM-Elements, da die Funktion dieses Element manipuliert.

ThirdPartyApp.doSomething("#elementId").then(function (success) { 

        }, function (error) { 

        }); 

Aber ich bekomme die Fehlermeldung: Unable Element mit der ID zu bekommen ...

Ich nehme an, die App nutzt document.getElementById, weil ich versuchte, es manuell zu nennen, aber es findet nicht das Element selbst obwohl es nach dem DOM-Explorer des Browsers existiert.

Das Element mit der ID befindet sich in einer HTML-Seite, die ich über ng-include einschließe.

Wie löse ich dieses Problem in meiner AngularJS-Umgebung, da ich die Funktionsweise der Drittanbieter-App nicht ändern kann?

Weitere Informationen

Hier ist die HTML-Seite mit dem Elemente:

<div> 
    <iframe id='testId' ng-src='{{test}}' style='overflow: hidden;' /> 
</div> 

Hier ist, wie ich diese HTML-Seite einzufügen:

<ng-include src="'/views/shared/test.html'"></ng-include> 

Warum document.getElementById("testId") in den AngularJS Factory findet das Iframe-Element nicht?

Answer 1

Es ist schwer zu sagen, was genau hier vorgeht, da ich den Quellcode für die von Ihnen verwendete Third Party Library nicht sehen kann.

Meine Vermutung ist jedoch, dass die Vorlage, die Sie mit ng-include hinzufügen, den Inhalt nicht geladen hat, wenn Sie den Aufruf des Iframe-Elements aufrufen.

Um dies zu überprüfen, versuchen, das Element zu erhalten, indem Sie den folgenden zu Ihrem AngularJS Controller hinzufügen:

$scope.$on('$includeContentLoaded', function() { 
    var myTest = document.getElementById("testId"); 
}); 

Dieser Codeblock wird für die „ng Inklusions“ Inhalt zu machen warten.