Come distruggere un'app angularjs?

Question

Devo essere in grado di caricare/scaricare applicazioni angolari dinamicamente senza causare perdite di memoria. In jQuery puoi fare $("#elementHoldingMyWidget").remove(); e il codice di distruzione corretto viene eseguito, i gestori di eventi non sono collegati ecc.

Non sono riuscito a trovare nulla nei documenti angolari che menzionassero la possibilità di abbattere un'app una volta che è stata avviata.

mio primo tentativo è stato quello di distruggere le rootScope in questo modo:

var rootScope = $("body").scope(); 
rootScope.$destroy(); 

Ma questo non sembra funzionare, e io non sono sicuro di come l'iniettore e servizi sarebbero ripulite anche se fatto.

Come dovrebbe essere fatto?

Answer 1

UPDATE 10 marzo 2013: Ho trovato $ ('body'). Empty(); non abbatte l'app. Vive ancora.

POST ORIGINALE:

Beh, questo post: https://github.com/angular/angular.js/issues/1537#issuecomment-10164971 sostiene che non v'è alcuna applicazione 'ufficiale' abbattere (al momento della scrittura), ma si può solo svuotare l'elemento che tiene l'applicazione in questo modo :

$('body').empty(); 

Se questo non è quello che stai cercando si può passare attraverso questi passaggi per una soluzione temporanea per strappare la vostra applicazione verso il basso: https://github.com/angular/angular.js/issues/1537#issuecomment-10184033

Answer 2

di abbattere la mia domanda senza presentare l'utente con una pagina bianca via $('body').empty, ho $delete() gli ambiti del bambino e quindi rimuovere tutti gli oggetti di $rootScope:.

/* 
* Iterate through the child scopes and kill 'em 
* all, because Angular 1.2 won't let us $destroy() 
* the $rootScope 
*/ 
var scope = $rootScope.$$childHead; 
while (scope) { 
    var nextScope = scope.$$nextSibling; 
    scope.$destroy(); 
    scope = nextScope; 
} 

/* 
* Iterate the properties of the $rootScope and delete 
* any that possibly were set by us but leave the 
* Angular-internal properties and functions intact so we 
* can re-use the application. 
*/ 
for(var prop in $rootScope){ 
    if (($rootScope[prop]) 
     && (prop.indexOf('$$') != 0) 
     && (typeof($rootScope[prop]) === 'object')) { 
      $rootScope[prop] = null; 
     } 
} 

Answer 3

Uso AngularJS 1.4.0, $ rootScope $ distruggere() sta funzionando di nuovo (come è stato rotto in 1.2). Usando questo permetti di passare tra diverse app angularJS:

var appManager = new function() { 
    this.currentAppName; 
    this.currentApp; 

    this.startApp = function (appContainerId, appName) { 
     if (this.currentApp) { 
      this.destroyApp(this.currentApp, this.currentAppName); 
     } 
     var appContainer = document.getElementById(appContainerId); 
     if (appContainer) { 
      this.currentAppName = appName; 
      this.currentApp = angular.bootstrap(appContainer, [appName]); 
     } 
    } 

    this.destroyApp = function (app, appName) { 
     var $rootScope = app.get('$rootScope'); 
     $rootScope.$destroy(); 
    } 
} 

// Call this when page is ready to rebootsrap app 
appManager.startApp('divContainerId', 'app');