Nella mia vista sono presenti un elenco di elenchi ul
collegati che utilizzano un'interfaccia utente jQuery: Direttiva ordinabile per facilitare il trascinamento e il rientro degli elementi dell'elenco.Angular.js: è possibile eseguire il re-rendering di ng-ripetizioni in base ai dati di ambito esistenti?
Modifiche faccio tramite drag di jQuery UI e rilasciare applico al $scope
utilizzando la funzione $apply
, questa parte funziona ...
L'edizione che sto funzionando in ora però è che il calo in alcune di queste liste che fornisco un modulo personalizzato che l'utente deve compilare.
L'utente ha la possibilità di:
- compilare il modulo e continuare, che poi fa il
$apply
chiamata a persiste i dati nel$scope
- fare clic su un pulsante Annulla che invece di chiamare il
$apply
per archiviare le informazioni, è necessario ripristinare l'ultima interazione di trascinamento/rilascio in modo efficace 're-rendering' tutte le mie liste per riflettere i dati che sono ancora nello$scope
in questa fase (poiché l'ultima resistenza non aveva ancora avuto alcun effetto su di esso).
L'effetto di questo pulsante "annulla" ripristina efficacemente tutto fino al punto prima che l'utente abbia raccolto l'elemento dell'elenco e lo abbia trascinato in un altro elenco.
Come posso forzare un 'aggiornamento' o 're-rendering' dei miei ng-repeat
s in modo che vengano visivamente aggiornati e mostrino di nuovo i dati correnti di $scope
?
In genere, la modifica del modello dati ($ scope) funzionerà, se eseguita all'interno di AngularJS. Se fatto fuori, chiamare $ scope. $ Apply() dovrebbe attivare l'aggiornamento/aggiornamento. Alla fine delle tue manipolazioni di annullamento, stai chiamando $ scope. $ Apply() o avvolgendo le tue modifiche in $ scope. $ Apply (function() {... changes here ...})? –
In effetti sto chiamando '$ scope.apply()' dalla direttiva basata su jQuery ma non sembra forzare un ricaricamento/re-rendering dei dati esistenti. Probabilmente perché Angular pensa che tutto sia esattamente lo stesso, non sapendo di aver fatto la manipolazione DOM senza dirlo a riguardo. Quindi quello di cui ho veramente bisogno è solo un tipo di chiamata di "force refresh", dove Angular indipendentemente dallo stato di '$ scope' impone solo un aggiornamento dei suoi dati renderizzati. – Jannis
Bene, come soluzione alternativa, cosa succede se rimuovi l'oggetto trascinato da $ scope all'interno della tua chiamata a $ scope. $ Apply() - Angular dovrebbe vederlo e rerender - quindi sulla riga successiva (ancora dentro il tuo $ scope . $ apply() call) aggiungilo di nuovo usando $ timeout(): '$ timeout (function() {... aggiungi elemento rimosso di nuovo a $ scope qui ...});' La manipolazione $ scope che esegui in la funzione $ timeout dovrebbe causare il verificarsi di un secondo rendering. –