2016-03-19 18 views
7

Questa è la mia prima domanda su SO.

Quando si unisce un elemento di un array sull'oscilloscopio, tale modifica non viene riflessa quando viene eseguita in un callback di bootbox.js.

Works:

$scope.deleteA = function() { 
    if (confirm("Really delete Item 3?")) { 
     $scope.itemsA.splice(2, 1); 
    } 
} 

non funziona:

$scope.deleteB = function() { 
    bootbox.confirm("Really delete Item 3?", function(answer) { 
     if (answer === true) { 
     $scope.itemsB.splice(2, 1); 
     } 
    }); 
} 

Sono soprattutto interessato a comprendere il motivo per cui . Questo è molto più importante per me che avere una soluzione alternativa.

I created a Plunker to show the effect

+1

nel bootbox di richiamo angolare non sapere che qualcosa cambia, ecco perché non aggiornare vista – Grundy

risposta

7

Qualsiasi cambiamento accade con variabile portata angolare dal mondo ouside angolare, non intima sistema angolare digerire per eseguire digerire ciclo per l'aggiornamento obbligatorio.
Nel callback angolare bootbox non si sa che qualcosa cambia, ecco perché non aggiornare la visualizzazione.
Per risolvere questo problema, è necessario dare il via ciclo di digest manualmente utilizzando $apply method, o $timeout service, come questo metodo sicuro

bootbox.confirm("Really delete Item 3?", function(answer) { 
    if (answer === true) { 
    $scope.$apply(function(){ 
     $scope.itemsB.splice(2, 1); 
    }); 
    } 
}); 
+0

Ciao @Grundy. La ringrazio per la risposta. Vedo che questa soluzione funziona, ma non riesco ancora a capire PERCHÉ l'angolare 'vede' le modifiche apportate, quando sono fatte in una funzione scope, ma non le vede, quando sono fatte in una funzione, che è anche definito all'interno di una funzione scope. Dove finisce il mondo di Angular e perché? –

+0

@DannySoul, perché su ogni evento degli utenti, come 'click',' change', 'keyup' e etc loop run digest automatico e aggiorna vista se necessario, nel tuo caso - angolare non eseguito dopo callback bootbox, e tu dovrebbe eseguirlo manualmente – Grundy

+0

@Grundy, grazie ancora per la tua risposta. Ma ancora non lo capisco davvero. Supponiamo che $ $ scope.name sia una stringa con un nome al suo interno. È noto per angolare. Se cambio il valore di '$ scope.name' da una funzione' $ scope.myFunction' si riflette nella vista. Se cambio il valore all'interno di una funzione che definisco all'interno di '$ scope.myFunction' (' setTimeout' per esempio) non viene riflesso. Perché è angolare in grado di vederlo in un caso ma non nell'altro. Perché la funzione ** calling ** è importante? –

0

per applicare delle modifiche al contenuto sarebbe utilizzando $timeout servizio.

bootbox.confirm("Really delete Item 3?", function(answer) { 
    if (answer === true) { 
    $timeout($scope.itemsB.splice(2, 1)); 
    } 
}); 

quindi non avete bisogno di preoccuparsi di $digest fase e la vostra $apply sarà una pila alta chiamata a dare un'occhiata a https://github.com/angular/angular.js/wiki/Anti-Patterns punto -2.

Non fare if (! $ Portata. $$ fase) $ portata. Applicare $(), significa che il $ portata. $ Applicare() non è sufficientemente alto nello stack di chiamate.

Problemi correlati