Angularjs 使用 FileReader 获取文件 url

Question

element.bind('change', function () {

                var file = element[0].files[0];
                console.log(file);
                var reader = new FileReader();
                var url1 = reader.readAsDataURL(file);
                console.log(url1);
            });

我在我的指令中使用了这个。当我控制文件时，它显示文件名、上次修改日期等。但是当我控制 url1 时，它显示未定义。如何使用文件 reader 获取图像 url。谢谢。

Answer 1

您应该检查 reader 对象而不是将其分配给变量：

element.bind('change', function () {
    var file = element[0].files[0];
    console.log(file);
    var reader = new FileReader();
    reader.readAsDataURL(file);
    console.dir(reader);
    });

结果：

FileReader    error    :    null
onabort    :    null
onerror    :    null
onload    :    ƒ (e)
onloadend    :    null
onloadstart    :    null
onprogress    :    null
readyState    :    2
result    :    "data:image/png;base64,iVBORw0K[...]

Angularjs 使用 FileReader 获取文件 url

Angularjs get file url using FileReader

filereader

angularjs

angularjs-directive