Ich möchte eckige Komponenten dynamisch mit Javascript erstellen und dann eckig mit $compile
mit einem neu erstellten Bereich kompilieren. Wenn ich dann nicht mehr für diese Komponente verwende, möchte ich die Komponente und den neuen Bereich zerstören.
Alles funktioniert wie erwartet, abgesehen von der Tatsache, dass, obwohl ich den neuen Bereich zerstöre, der gesamte Speicher, den er benutzt, niemals freigegeben wird.
Hier ist ein Teil einer vereinfachten Version dieses Codes:
%Vor%Voll funktionsfähiges Beispiel für diesen Code ist hier
All dieser Code erstellt bei jedem Klick auf die Schaltfläche eine neue Komponente, zerstört jedoch zuerst eine bereits vorhandene Komponente. Beachten Sie, dass ich die kompilierte Komponente auf der Seite nicht wirklich hinzufüge, da ich festgestellt habe, dass das Leck immer noch vorhanden ist, unabhängig davon, ob ich es verwendet habe oder nicht.
Mit den Entwicklungstools von Chrome (Profile - & gt; Record Allocation Timeline - & gt; Start) sehe ich die folgende Speicherbelegung, nachdem ich auf die Schaltfläche geklickt habe ein paar Mal:
Es ist klar, dass jeder von der customDirective belegte Speicher niemals tatsächlich freigegeben wird, obwohl die $destroy
-Funktion des Bereichs aufgerufen wird.
Ich habe $compile
erfolgreich in der Vergangenheit verwendet, ohne einen neuen Bereich zu erstellen, aber es scheint, dass mir in diesem Szenario etwas fehlt. Sollte ich etwas anderes tun, um sicherzustellen, dass es keine Hinweise auf den neuen Anwendungsbereich gibt?
Basierend auf der unten stehenden Antwort von JoelCDoyle, hier ist der Fix (ich füge eine Funktion on destroy den Scopes hinzu, die ich erstelle):
%Vor%Ich denke, ich habe eine Lösung gefunden: Ссылка
%Vor%Ich weiß immer noch nicht genau, warum das funktioniert, aber dieser Abschnitt, Wie Anweisungen kompiliert werden , in eckigen Kompilierungsdokumenten liefert einen Hinweis: Ссылка
$ compile verknüpft die Vorlage mit dem Bereich, indem sie den kombinierten Aufruf aufruft Verknüpfungsfunktion vom vorherigen Schritt. Dies wiederum ruft die Verknüpfungsfunktion der einzelnen Anweisungen, Registrierung Listener über die Elemente und Einrichten von $ watchs mit dem jeweiligen Bereich Anweisung ist konfiguriert zu tun. \
Das Ergebnis ist eine Live-Bindung zwischen dem Bereich und dem DOM . Also bei diesem & gt; Punkt, eine Änderung in einem Modell auf dem kompilierten Bereich wird im DOM widergespiegelt.
Das Zerstören des Oszilloskops, nehme ich an, entfernt diese Elementlistener nicht. Das macht der obige Code: destroy directory / kind scope auf scope destroy
Die Freigabe wird aufgehoben, wenn Sie das Array in den Bereich verschieben und die Zuordnung aufheben
%Vor%zum Zielrechner. Aber ... schön zu wissen. Ich werde genau auf den Speicherverbrauch achten müssen. Scheint, dass der Umfang beibehalten wird. Weil ich nur innere Variablen loslasse.
Tags und Links javascript angularjs memory-leaks memory