Как связать FileList с наблюдаемым в Dart Polymer?

Question

Я пытаюсь использовать загрузку файла в сочетании с Dart & Polymer. Рассмотрим следующие файлы:

мой-upload.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> 

мой-upload.dart

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

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

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

Отпечаток-оператор в uploadFiles всегда печатает нуль. Кажется, что файлList не привязан к наблюдаемому. Есть ли способ решить эту проблему? Должен ли я использовать другой оператор, чем bind-файлы?

Конечно, есть обходной путь, но он попадает в точку, я думаю:

мой-upload.dart

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

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

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

Есть идеи?

Answer 1

FileList не наблюдается. В аннотации @observable вы можете только наблюдать, изменились ли файлы, чтобы он указывал на другой список файлов, но не на изменения в 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); 
    } 
}