Question

我的Angular 5表单中有一个文件输入，可以将文件上传到AWS S3存储桶中。

我的HTML看起来像这样：

<input type="file" (change)="fileEvent($event)" name="imageUpload" id="imageUpload" />
{{this.isLoading}}

这是我的组成部分：

isLoading: boolean = false;

fileEvent(fileInput: any) {
    this.isLoading = true;
    s3.upload({ Key: file.name, Bucket: bucketName, Body: file, ACL: 'public-read' }, function (err, data) {
      this.isLoading = false;
      if (err) {
        console.log(err, 'there was an error uploading your file');
      }
    });
  }

当我开始上传时，isLoading变量成功更改为true，但在完成后不会更改回false。我做错了什么？

Answer 1

在以下代码段中：

s3.upload({ Key: file.name, Bucket: bucketName, Body: file, ACL: 'public-read' }, function (err, data) {
  this.isLoading = false;
  if (err) {
    console.log(err, 'there was an error uploading your file');
  }
});

this的{{1}}实际上是指匿名函数本身，而不是绑定对象。保持旧的参考：

this.isLoading

它应该有用。

通过Angular将文件上载到AWS S3时加载指示符

1 个答案: