标签: filereader

如何在AngularJS中读取文件?

是否可以读取AngularJS中的文件?我想将文件放入HTML5画布中进行裁剪.

我在考虑使用指令?这是我想要放入我的指令的javscript代码:

function readURL(input) {

    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
            $('#blah').attr('src', e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
    }
}
Run Code Online (Sandbox Code Playgroud)

javascript canvas filereader angularjs

20
推荐指数
2
解决办法
9万
查看次数

FileReader onload with result和parameter

我无法在onload函数中同时获得filereader和一些参数的结果.这是我的代码:

控制HTML:

<input type="file" id="files_input" multiple/>
Run Code Online (Sandbox Code Playgroud)

Javascript功能:

function openFiles(evt){
    var files = evt.target.files;
    for (var i = 0; i < files.length; i++) {
      var file=files[i];
      reader = new FileReader();
      reader.onload = function(){
          var data = $.csv.toArrays(this.result,{separator:'\t'});
      };
      reader.readAsText(file);
    }
  }
Run Code Online (Sandbox Code Playgroud)

添加活动:

 files_input.addEventListener("change", openFiles, false);
Run Code Online (Sandbox Code Playgroud)

filereader.resultonload函数中使用了.如果我为这个函数使用参数,比如file,我就不能再访问结果了.例如,我想file.name在onload函数中使用.如何解决这个问题?

javascript filereader

20
推荐指数
3
解决办法
4万
查看次数

如何使用Jest/Enzyme在React中测试文件类型输入的更改处理程序?

我想测试我的React组件是否可以用来FileReader<input type="file"/>元素中导入用户选择的文件的内容.我的下面的代码显示了一个测试中断的工作组件.

在我的测试中,我试图使用blob作为文件的替代品,因为blob也可以被"读取" FileReader.这是一种有效的方法吗?我还怀疑问题的一部分reader.onload是异步的,我的测试需要考虑到这一点.我需要某个地方的承诺吗?或者,我是否需要模拟FileReader使用jest.fn()

我更愿意只使用标准的React堆栈.特别是我想使用Jest和Enzyme而不必使用Jasmine或Sinon等.但是如果你知道Jest/Enzyme 无法做到的事情,但可以采用另一种方式,那也可能有所帮助.

MyComponent.js:

import React from 'react';
class MyComponent extends React.Component {
    constructor(props) {
        super(props);
        this.state = {fileContents: ''};
        this.changeHandler = this.changeHandler.bind(this);
    }
    changeHandler(evt) {
        const reader = new FileReader();
        reader.onload = () => {
            this.setState({fileContents: reader.result});
            console.log('file contents:', this.state.fileContents);
        };
        reader.readAsText(evt.target.files[0]);
    }
    render() {
        return <input type="file" onChange={this.changeHandler}/>;
    }
}
export default MyComponent;
Run Code Online (Sandbox Code Playgroud)

MyComponent.test.js:

import React from 'react'; import {shallow} from …
Run Code Online (Sandbox Code Playgroud)

javascript filereader reactjs jestjs enzyme

19
推荐指数
1
解决办法
1万
查看次数

通过Python更改CSV文件中的特定值

我需要改变csv文件列的特定值的方法.例如,我有csv文件:

"Ip","Sites"
"127.0.0.1",10
"127.0.0.2",23
"127.0.0.3",50
Run Code Online (Sandbox Code Playgroud)

我需要更改"127.0.0.2"的值23到30.

我使用csv库:import csv

感谢任何帮助,因为我是Python的新手.谢谢!

python csv filereader

18
推荐指数
4
解决办法
6万
查看次数

在Firefox中对已更改的文件使用FileReader.readAsArrayBuffer()

我遇到了一个奇怪的问题FileReader.readAsArrayBuffer,这似乎只影响Firefox(我在当前版本中测试过 - v40).我不知道我是做错了还是这是一个Firefox bug.

我有一些JavaScript readAsArrayBuffer用于读取<input>字段中指定的文件.在正常情况下,一切正常.但是,如果用户在<input>字段中选择后修改文件,readAsArrayBuffer可能会非常困惑.

ArrayBuffer我从后面readAsArrayBuffer总是有该文件最初的长度.如果用户更改文件以使其更大,我不会获得原始大小后的任何字节.如果用户更改文件以使其变小,则缓冲区仍然具有相同的大小,并且缓冲区中的"多余"填充有字符代码90(如果被视为字符串则为大写字母'Z').

由于此代码非常简单,并且在我测试的其他所有浏览器中都能完美运行,因此我认为这是一个Firefox问题.我已经将它报告为 Firefox的一个错误,但我想确保这不仅仅是我做错了.

可以通过以下代码段重现该行为.你所要做的就是:

  1. 浏览一个包含10个字符的文本文件(10个不是幻数 - 我只是以它为例)
  2. 观察结果是一个包含10个项目的数组,表示每个项目的字符代码
  3. 当它仍在运行时,从文件中删除5个字符并保存
  4. 观察结果仍然是10个项目的数组 - 前5个是正确的,但最后5个都是90个(大写字母Z)
  5. 现在添加了10个字符(所以文件现在长15个字符)
  6. 观察结果仍然是10个项目的数组 - 最后5个不返回

function ReadFile() {
  var input = document.getElementsByTagName("input")[0];
  var output = document.getElementsByTagName("textarea")[0];

  if (input.files.length === 0) {
    output.value = 'No file selected';
    window.setTimeout(ReadFile, 1000);
    return;
  }

  var fr = new FileReader();
  fr.onload = function() {
    var data = fr.result;
    var array = new …
Run Code Online (Sandbox Code Playgroud)

javascript firefox filereader fileapi

18
推荐指数
2
解决办法
4万
查看次数

逐行读取文件的最快方法是每行有2组字符串?

我可以逐行读取每行包含两个字符串的最快方法是什么.示例输入文件将是:

Fastest, Way
To, Read
One, File
Line, By Line
.... can be a large file
Run Code Online (Sandbox Code Playgroud)

即使字符串之间有空格,每行也总共有两组字符串,例如"By Line"

目前我正在使用

FileReader a = new FileReader(file);
            BufferedReader br = new BufferedReader(a);
            String line;
            line = br.readLine();

            long b = System.currentTimeMillis();
            while(line != null){
Run Code Online (Sandbox Code Playgroud)

这是否足够有效或使用标准JAVA API有更高效的方式(请不要外部库)任何帮助表示赞赏谢谢!

java filereader bufferedreader

17
推荐指数
1
解决办法
6万
查看次数

HTML5文件API:FileReader.readAsText()返回"undefined"

我在Mac OS X上使用Chrome 12,我在文档中包含了jQuery 1.6.1.

我尝试将文件的内容作为文本读取,并使用以下函数将其保存在数据对象中:

this.upload = function(file) {
    console.log('FileHandler.upload called with ' + file.name + '.');
    console.log(file);
    console.log(this.reader);

    data = {
        content: this.reader.readAsText(file)
    }

    console.log('Content: ' + data.content);
}
Run Code Online (Sandbox Code Playgroud)

"file"接缝是有效的文件对象,"this.reader"是FileReader类型的新实例.此代码创建以下控制台输出:

http://cl.ly/1Y2b383G2F272x1m1P0N

在此输入图像描述

javascript html5 filereader fileapi

17
推荐指数
1
解决办法
2万
查看次数

Angular2 + Typescript + FileReader.onLoad =属性不存在

我正在使用FileReader接口和它的异步方法readAsText()来读取本地文本文件,之后当调用onload事件时,我尝试读取我的文件,我的源代码如下所示:

export class ReadFileComponent {
   text: string;

   readFile(): void {
     let reader=new FileReader();
     reader.onload = function(e) {
        this.text=reader.result;
     }
     reader.readAsText(file);   
   }
}
Run Code Online (Sandbox Code Playgroud)

编译失败,因为"FileReader"类型上不存在属性"text "

我认为这是由于EventListener接口不接受对象,

有人请解决这类问题吗?

多谢你们,

javascript filereader typescript angular

17
推荐指数
1
解决办法
3万
查看次数

HTML5文件API:在FileReader回调中获取File对象

使用Javascript中的新File API,您可以在Javascript中读取文件以创建dataURL以显示客户端的客户端图片.我想知道你是否可以在FileReader的onload回调中访问File对象.我将用一个例子来说明这一点:

var div = document.createElement('div');
div.ondrop = function(e) {
  e.preventDefault();
  e.stopPropagation();
  var files = e.dataTransfer.files;
  for ( var i=0; i<files.length; i++ ) {
    var file = files[i]; // this is the file I want!!
    var filereader = new FileReader();
    filereader.onload = function(e) {
      this; // the FileReader object
      e.target; // the same FileReader object
      this.result; // the dataURL, something like data:image/jpeg;base64,.....
      var img = document.createElement('img');
      img.src = this.result;
      img.title = file.fileName; // This won't be working
      document.appendChild(img);
    }
  } …

javascript html5 file filereader

16
推荐指数
1
解决办法
2万
查看次数

html5 fileReader - 如何只读取文件的前N个字符?

目前我使用如下的模式来读取一系列文件的前3个字符:

var files = e.dataTransfer.files;
for (var i = 0, f; f = files[i]; i++) {
  var fr = new FileReader();
  fr.onload = function(e) { 
    var first_three_chars = e.target.result.substr(0,3);
  }
  fr.readAsText(f);
}
Run Code Online (Sandbox Code Playgroud)

麻烦的是我只对文件的前3个字符感兴趣,而这个方法读取整个文件,浪费了大量的内存和时间.如何快速迭代文件,只需快速查看第一个字符?

编辑:slice()是答案,谢谢sshen.我是这样做的:

var files = e.dataTransfer.files;
for (var i = 0, f; f = files[i]; i++) {
  var fr = new FileReader();
   fr.onloadend = function(e) {
    if (e.target.readyState == FileReader.DONE) {
      var first_three_chars = e.target.result;
    }
  };
  var blob = f.slice(0, 3);
  fr.readAsText(blob);
}
Run Code Online (Sandbox Code Playgroud)

javascript html5 filereader

16
推荐指数
1
解决办法
6162
查看次数