2013-04-30 15 views
10

Ho un regolatore di come questo:ng-click non funziona su DOM AngularJS dinamico?

@VariantModalCtrl = ($scope) -> 
    $scope.upload_variant_image = -> 
    alert("test") 

Quando provo a chiamare la funzione upload_variant_image utilizzando ng-click, funziona solo quando il legame con un DOM statico (quando i carichi DOM), ho un link come questo :

ma questo elemento viene aggiunto dinamicamente dopo il caricamento del DOM, quindi ng-click non funziona.

Aggiornamento appena trovato parte della mia risposta usando $ funzione di compilazione: AngularJS + JQuery : How to get dynamic content working in angularjs

MA non funziona quando aggiorno il DOM come questo in Rails:

$(".modal-body").html($compile("<%= j render("/variants/form", :variant => @variant) %>")(scope)); 
+0

potresti per favore condividere demo fiddle o demo plunker –

risposta

15

lo farei avverti che potresti non abbracciare completamente la filosofia angolare se stai manipolando il DOM attraverso mezzi angolari esterni. Aggiungendo i collegamenti dinamicamente con AngularJS è semplice come qualsiasi altra cosa e sarà probabilmente molto più semplice e più idiomatico che far funzionare la tua libreria esterna. Ecco un semplice esempio in base alla tua domanda:

<ul> 
    <li ng-repeat="item in items"> 
    <a ng-click="upload_variant_image()">{{item.name}}</a> 
    </li> 
</ul> 

Tutto quello che dovete fare è legare il backup dei dati campo di applicazione in modo appropriato e questo sarà sempre "solo lavoro".

Detto questo, se si sta manipolando il DOM, è possibile che si verifichino binding AngularJS (per esempio, ng-clic come desiderato) utilizzando $compile service. Considerare l'opzione migliore sopra, però. :)

Problemi correlati