entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

1voto

Problema con acceder a los datos de un Controller contenedor de un ngDialog

Buenas tardes, tengo este parte en mi controller desde le cual llamo a un ngDialog y me sale bien el dialogo pero no logro acceder a mostrar los datos de mi controller, para mostrar en mis input el resultado de un llamado a un servicio.
en mi JavaScript tengo este código que me funciona todo bien menos el mostrar datos en el html de mi controler en el template del ngDialog

(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.lbanner = [];
        vm.nfrase  = '';
        vm.iden    = 0; 

        vm.efrase   = '';

        vm.edit = function(){           
            FraseService.get(vm.iden).then(function(response){
                console.log(response.data.response);
                vm.efrase = response.data.response;
                ngDialog.open({ 
                    template: 'newFrase',
                    scope: this   **//aquí es donde recide mi problema, no se que poner para acceder arriba y tomar los valores de arriba para cojer la respuesta de mi servicio**
                });
            });         
        }    
    }
}());

en mi HTML:

<!-- Modal de Edit Frase-->
<script type="text/ng-template" id="newFrase">  
      <h1>Nueva Frase {{frase.texto}}</h1>
      <div class="modal-body">
        <div class="row">
            <div class="form-group">
                <label for="frase" class= "col-lg-2 espaciar">Frase: </label>
                <div class="col-lg-10">   
                    <input ng-model="frase.efrase.frace" type="text" name="frase" id="frase" class="form-control" placeholder="Escriba su frace aquí">
                </div>  
                <br>     
                <label for="autor" class= "col-lg-2 control-label espaciar">Autor: </label>        
                <div class="col-lg-10 ">               
                    <input type="text" name="autor" name="autor" class="form-control" placeholder="Escriba el Autor aquí">                      
                </div>  
                <br>
                <label class="col-lg-2 espaciar">Banner: </label>
                <div class="col-lg-10">
                    <select name="banner" class="form-control selectize-input espaciar">
                        <option value="0"><< Ninguno >></option>
                        <option ng-repeat="itemb in FraseController.lbanner" value="{{itemb.id}}">
                            {{itemb.titulo}}
                        </option>              
                    </select>
                </div>        
            </div>
        </div>
      </div>

      <div class="modal-footer">
        <button type="button" 
                class="btn btn-default" 
                ng-click="closeThisDialog()">Cancelar</button>
        <input name="submit" value="Insertar" class="btn btn-primary" title="Insertar" type="submit">        
      </div>  
</script>
<!-- Fin de Edit Frase Modal -->

1 Respuesta

2votos

white Puntos75880

Hola @dairon, hay varias formas de solventarlo, que te parece si creas un controlador a parte para el dialogo? llamemoslo FraseDialogController de esta forma podrás usar resolve para solicitar dependencias en ese controlador.

tu controlador FraseController quedaría:

(function() {
    'use strict';

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

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

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

        vm.iden = 0;
        vm.edit = edit;

        function edit () {
            ngDialog.open({
                template: 'newFrase',
                controller: 'FraseDialogController',
                controllerAs: 'fraseDialogCtrl',
                resolve: {
                    efrase: function () {
                        return FraseService.get(vm.iden).then(function(response) {
                            // esto es lo que se retorna a la dependencia
                            // de FraseDialogController
                            return response.data;
                        });
                    }
                }
            });
        }
    }

}());

y el controlador FraseDialogController podría quedar así:

(function() {
    'use strict';

    angular
        .module('app')
        .controller('FraseDialogController', FraseDialogController);

    FraseDialogController.$inject = ['efrase'];

    function FraseDialogController(efrase) {
        var vm = this;

        vm.listar = [];
        vm.lbanner = [];
        vm.nfrase = '';
        vm.iden = 0;
        vm.texto = 'Frase Ocasional';
        vm.efrase = efrase;
    }

}());

de esa forma en el template de tu dialog podrías acceder a la dependencia con fraseDialogCtrl.efrase


<h1>Nueva Frase {{fraseDialogCtrl.texto}}</h1>

y

<input ng-model="fraseDialogCtrl.efrase.frace" type="text" name="frase" id="frase" class="form-control" placeholder="Escriba su frace aquí">

0voto

dairon comentado

Gracias @white pero ayer por la noche aprendí más cosas sobre Factory y sus utilidades así que se me ocurrió poner en el factory que tengo de frases un atributo id y con un metodo set y get acceder a su valor, luego pasar este servicio a un controlador echo en el ngDialog y desde ahy hacer la llamada al servicio y hacer todo el trabajo

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta