Question

Buenos Días, ejecuto el ngDialog pero una vez que este termina su trabajo haciendo clic por ejemplo en editar quiero que la lista que tengo de frases se me actualise automaticamente.
tengo mi controller:
(function() {
'use strict';

angular
    .module('admin')
    .controller('FraseController', FraseController);

FraseController.$inject = ['FraseService','ngDialog'];

function FraseController(FraseService,ngDialog) {
    var vm = this;

    vm.texto   = 'Frase Ocasional';
    vm.listar  = [];        
    vm.nfrase  = '';        
    vm.efrase  = '';      
    vm.eid     = 0; 

    activate();

    vm.edit = function(){    
        FraseService.set_id(vm.eid);
        ngDialog.open({
            template: 'editFrase',                 
            controllerAs: 'efrase',               
            controller: ['FraseService', function(FraseService) {
                var vm = this;
                vm.eid = FraseService.get_id();
                vm.frase = {};
                cargar();

                    function cargar(){
                        FraseService.get(vm.eid).then(function(response){ 
                            vm.frase = response.data.response;                     
                        });
                    }
                    vm.editar = function(){                        
                        if(FraseService.update(vm.frase)){
                            refresh(); // este es el método que me refrescaría la lista del controlador padre que visualiso en mi html pero no me funciona y como uso this no se como escalar para llamar al $scope padre pero tampoco se si eso funcionaría pues como en el padre no uso scope sino this no entiendo esto bien.
                        }
                    }
                }]                
        });            
    }

    vm.drop = function(){
        FraseService.drop(vm.eid).then(function(response) {
            console.log(response.data.response);
            refresh(); // aqui si me funciona;
        });
    }

    function refresh(){
        FraseService.getAll().then(function(response) {
                vm.listar = response.data.response;
        });
    }

    function activate() {            
        FraseService.getAll().then(function(response) {
            vm.listar = response.data.response;
        });
    }
}

}());
Quiero que se me actualice la lista una vez se me edite un elemento que se guarda en el api que a su vez actualiza la database entonces quiero que se llame de nuevo al api y me resfresque la lista que tengo.
Saludos cordiales D

Answer 1

Buenos Días, aquí les dejo como resolví todos mis problemas con ngDialog.
como lo ejecuto esperando una respuesta lo invoco con ngDialog.openConfirm y según la respuesta ejecuto los métodos de mi clase madre y le paso como parámetro un objeto de donde onsumiré sus datos.
Este es mi código para eliminar una Frase.
el JS en mi controller:

vm.drop = function(__frase){ //Elimina la frase
            ngDialog.openConfirm({
                template:   '<h3>Está seguro de Eliminar la Frase<h3> '+                            
                            '<div class="modal-footer"> '+
                                '<button type="button" '+
                                    'ng-click=closeThisDialog("Cancelo") '+
                                    'class="btn btn-default">Cancelar'+
                                '</button> '+
                                '<button type="button" '+
                                    'ng-click=confirm(dfrase.frase.id) '+
                                    'class="btn btn-primary">Eliminar</button> '+
                            '</div>',
                plain:true, 
                controllerAs: 'dfrase',               
                controller: [function() {
                    var vm = this;                    
                    vm.frase = __frase;                                      
                    }]                
                })
            .then(
                function(value) { //Acepta                    
                    FraseService.drop(value).then(function(response) {
                        console.log(response.data.response);
                    });
                    refresh();
                },
                function(value) { //Cancela
                    console.log(value);
                }
            );
        }

Consumo el servicio de Frases que es un factory con el cual interactuo con mi api y el metodo refresh que me refresca la lista de elementos frases.
saludos D

Answer 2

Hola @dairon, lograste resolverlo?

FraseService.update es una funcion que regresa una promesa? si es así tendrías que colocar un callback, deberás trabajar de manera asíncrona.

FraseService.update(id).then(function () {
    refresh();
});

Te podría sugerir que tu dialogo tenga su propio controlador de esta forma lo mantienes mas ordenado.

En este caso no es necesario inyectar el servicio FraseService en el controlador del dialogo,

controller: ['FraseService', function(FraseService) {

ya que previamente la inyectaste en el controlador FraseController,

FraseController.$inject = ['FraseService','ngDialog'];

---

llamando a refresh desde el controlador de tu dialogo sería suficiente, te da algún error?

puedes llamar a refresh sin ningun problema por que tu controlador del dialogo esta dentro del contexto del controlador FraseController, en caso de que no este en este ( por ejemplo tu dialogo tiene un controlador aparte ), podrías hacer uso de $rootScope.$broadcast y $scope.$on para emitir eventos con información a otros controladores.

/* if(FraseService.update(vm.frase)) ¿update es asíncrono? */

FraseService.update(vm.frase).then(function(response) {
    $rootScope.$broadcast('frase-editada', {
        response: response.data.response
    });
});

y en tu controlador FraseController:

activate();

// ...

$scope.$on('frase-editada', function(event, data) {
    // aca hacemos algo con data?
    // o talvez solo llamamos a refresh() ?
});

---

$broadcast emite el evento hacia abajo, lo contrario a $emit