Come sostituire un contenuto html con jsf reRender o ajax load e rebindare il nuovo DOM con AngularJS?

Considera un po ‘di codice:

 

oppure, usando jsf, un pannello:

  

Angularjs capirà la direttiva ng-repeat, e quindi sostituirà il tag

  • per elenco di elementi.

    Ma, se il tuo html è cambiato, con un caricamento Ajax, o con un jsf reRender, il nuovo contenuto non verrà riconosciuto da AngularJS:

     $('#dest').load('replace.html'); 

    Abbiamo bisogno di compilare e applicare l’ambito AngularJS per il nuovo DOM:

    Sul controller, crea una funzione per compilare un nuovo html e associare allo stesso ambito:

     $scope.compileDOM = function($el) { ($compile($el))($scope); $scope.$apply(); }; 

    E, dopo aver caricato, chiamalo:

     $('#dest').load('replace.html', function() { $dest.scope().compileDOM($dest); }); 

    Guarda alla funzione .scope () . Permette di trovare un ambito AngularJS corretto per un elemento HTML. Non è necessario puntare direttamente all’elemento con ng-controller, è ansible utilizzare qualsiasi elemento sotto il controller ng.

    Esempio di plunk : PLUNKER