0

tengo el siguiente problema. Tengo una modal que hace uso de una directiva a la que se le pasan dos funciones callback y que, cuando abro la primera vez dicha modal, funciona perfectamente. El problema viene cuando cierro la modal y la vuelvo a abrir. En la consola me aparece el error:

Invalid Isolate Scope Definition
Invalid {3} for directive 'dropZone'. Definition: {... NaNd: '021' ...}

Aquí el código de la directiva:

moduloDirectivas.directive('dropZone',[
    function(){
        return config = {
            restrict: "A",
            scope: { 
                callbackUpload: '&callbackUpload', 
                callbackBeforeUpload: '&callbackBeforeUpload' 
            },
            template:'<label class="drop-zone">'+
                     '<input type="file" id="fileinput" />'+
                     '<div ng-transclude></div>'+       // <= transcluded stuff
                     '</label>',
            transclude: true,
            replace: true,
            require: '?ngModel',
            link: function(scope, element, attributes, ngModel){
                var upload = element[0].querySelector('input');    
                    upload.addEventListener('drop', uploadFileSelect, false);
                    upload.addEventListener('change', uploadFileSelect, false);

                    config.scope = scope;
            }
        }

        function uploadFileSelect(e) {
            e.stopPropagation();
            e.preventDefault();
            config.scope.callbackBeforeUpload({estado: true});
            var file = e.dataTransfer ? e.dataTransfer.files: e.target.files;
            file = file[0];

            var reader = new FileReader();
                reader.onload = (function(file) {
                    return function(e) { 
                        var data = e.target.result;
                        var objParameters = {
                            data: data,
                            nombreFichero: file.name,
                            tamanio: file.size
                        };
                        config.scope.callbackUpload({data: objParameters});
                        angular.element("#fileinput").val(null);
                        config.scope.callbackBeforeUpload({estado: false});
                    }
                })(file);
                reader.readAsDataURL(file);
        }
    }
]);

A ver si se os ocurre qué puede estar pasando. Gracias.

1
  • ¿Alguna idea de qué puede estar pasando?
    – Isaac R
    Commented el 18 sept. 2017 a las 5:52

1 respuesta 1

0

De la documentación de AngularJS (las negritas son mías):

& or &attr - provides a way to execute an expression in the context of the parent scope. If no attr name is specified then the attribute name is assumed to be the same as the local name. Given <my-component my-attr="count = count + value"> and the isolate scope definition scope: { localFn:'&myAttr' }, the isolate scope property localFn will point to a function wrapper for the count = count + value expression.

Apenas he trabajado con AngularJS, pero según entiendo debería existir en el contexto padre expresiones para las dos funciones que declaras:

scope: { 
            callbackUpload: '&callbackUpload', 
            callbackBeforeUpload: '&callbackBeforeUpload' 
        }

Revisa que cumples las condiciones requeridas

1
  • Si, están declaradas. Como comento, la primera vez que abro el modal, funciona perfectamente: llama a esas funciones sin problema. El problema es cuando cierro la modal y la abro de nuevo, da ese error. No se si ese error es porque tendría que volver a declarar la directiva o qué.
    – Isaac R
    Commented el 15 sept. 2017 a las 19:03

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.