2

我正在尝试将文件上传与 Dart & Polymer 结合使用。考虑以下文件：

我的上传.html

<polymer-element name="my-upload">
  <template>
    <style></style>
    <input type="file" id="uploader" bind-files="{{files}}" on-change="{{uploadFiles}}" multiple>
  </template>
  <script type="application/dart" src="my-upload.dart"></script>
</polymer-element>

我的上传.dart

@CustomTag('my-upload')
class MyUpload extends PolymerElement {        
  @observable FileList files;

  MyUpload.created() : super.created();

  void uploadFiles(event, details, target) {        
    print(files);
  }
}

uploadFiles 中的打印语句始终打印 null。看来，fileList 没有绑定到可观察对象。有没有办法解决这个问题？我必须使用绑定文件以外的其他语句吗？

当然，有一种解决方法，但我认为它没有抓住重点：

我的上传.dart

@CustomTag('my-upload')
class MyUpload extends PolymerElement {  
  FileUploadInputElement uploader;

  MyUpload.created() : super.created() {
    uploader = $['uploader'];    
  }

  void uploadFiles(event, details, target) {        
    print(uploader.files);
  }
}

有任何想法吗？

4

1 回答 1

0

FileList是不可观察的。使用@observable注释，您只能观察文件是否已更改，以便它指向不同的 FileList，但不能指向 FileList 内的更改。

在您的示例中，我看不出一个令人信服的理由，为什么您需要一个可观察的 FileList。你想用它做比我们从示例中看到的更多的事情吗？

你可以简化你的代码。我不知道这在您的用例中是否有意义：

@CustomTag('my-upload')
class MyUpload extends PolymerElement {  

  void uploadFiles(event, details, target) {        
    FileUploadInputElement uploader = $['uploader'];   
    print(uploader.files);
  }
}

甚至更短

@CustomTag('my-upload')
class MyUpload extends PolymerElement {  

  void uploadFiles(event, details, target) {        
    print($['uploader'].files);
  }
}
于 2013-11-29T17:23:11.317 回答