FileReader onload con resultado y parámetro

Contamos con tu ayuda para compartir nuestras reseñas referente a las ciencias de la computación.

Solución:

Intente envolver su función de carga en otra función. Aquí el cierre le da acceso a cada archivo que se procesa a su vez a través de la variable f:

function openFiles(evt)
    var files = evt.target.files;

    for (var i = 0, len = files.length; i < len; i++) 
        var file = files[i];

        var reader = new FileReader();

        reader.onload = (function(f) 
            return function(e) 
                // Here you can use `e.target.result` or `this.result`
                // and `f.name`.
            ;
        )(file);

        reader.readAsText(file);
    

Para una discusión de por qué se requiere un cierre aquí, consulte estas preguntas relacionadas:

• Cierre de JavaScript dentro de bucles: ejemplo práctico simple
• ¿Problema de bucle infame de Javascript?

Debe usar el cierre en el controlador 'onload'. Ejemplo: http://jsfiddle.net/2bjt7Lon/

reader.onload = (function (file)  // here we save variable 'file' in closure
     return function (e)  // return handler function for 'onload' event
         var data = this.result; // do some thing with data
     
)(file);

Usar

var that = this;

para acceder a variables externas en el alcance de la función.

function()
    that.externalVariable //now accessible using that.___

Mi escenario: uso de Angular 9. Luché con esto durante mucho tiempo, simplemente parecía que no podía hacerlo funcionar. Encontré lo siguiente como una solución realmente elegante para acceder a variables externas dentro de un function() bloquear.

public _importRawData : any[];

importFile(file){
    var reader = new FileReader();
    reader.readAsArrayBuffer(file);

    var data;
    var that = this;  //the important bit

    reader.onloadend = await function()
        //read data

        that._importRawData = data;  //external variables are now available in the function
    

Una de las partes importantes en el código anterior es el var palabra clave, que abarca variables fuera del bloque de funciones. Sin embargo, cuando accedí al valor de data después del bloque de funciones, todavía no estaba definido como la función ejecutada después del otro código. Intenté async y await, pero no pude hacerlo funcionar. y no pude acceder data fuera de esta función.

La gracia salvadora fue la var that = this línea. Usar eso permite acceder a variables externas dentro de la función. Entonces podría establecer esa variable dentro del alcance de la función y no preocuparme por cuándo se ejecuta el código. Tan pronto como se ha leído, está disponible.

Para la pregunta original, el código sería:

function openFiles(evt)
    var files = evt.target.files;
    for (var i = 0; i < files.length; i++) 
        var file=files[i];
      
        var that = this; //the magic happens
      
        reader = new FileReader();
        reader.onload = function()
            var data = $.csv.toArrays(this.result,separator:'t');
          
            that.file.name //or whatever you want to access.
        ;
        reader.readAsText(file);
    

Si posees alguna incertidumbre o forma de enriquecer nuestro enunciado eres capaz de dejar una crítica y con mucho placer lo observaremos.

---

---

Utiliza Nuestro Buscador