Я работаю над изучением AngularDart, и в настоящее время пытаюсь прочитать файл с помощью кнопки загрузки файла со следующим кодом в моем шаблоне.
<input type = "file" (change) = "onFileChanged($event)">
и мой обработчик событий в настоящее время находится в этой форме, но, похоже, ничего не работает. Используя консольную отладку, я знаю, что это тип File, но использование любых методов, таких как open и readAsString, терпит неудачу. To String работает, но onyl дает тип объекта в этом случае, [object File]
import 'dart:io';
import 'dart:html';
import 'package:angular/angular.dart';
// AngularDart info: https://webdev.dartlang.org/angular
// Components info: https://webdev.dartlang.org/components
@Component(
selector: 'my-app',
styleUrls: ['app_component.css'],
templateUrl: 'app_component.html',
directives: [coreDirectives],
)
class AppComponent {
String contents;
onFileChanged(event) {
contents = event.target.files[0].open(Mode: FileMode.read);
window.console.debug(contents);
}
}
Благодаря помощи из сообщения с таким же вопросом, как и мой, у меня все заработало. Я все еще использовал свой обработчик событий и убедился, что НЕ импортирует как dart: io, так и dart: html, нужен только dart: html.
Так выглядел мой последний обработчик событий.
import 'dart:html';
import 'package:angular/angular.dart';
@Component(
selector: 'my-app',
styleUrls: ['app_component.css'],
templateUrl: 'app_component.html',
directives: [coreDirectives],
)
class AppComponent {
String contents;
AppComponent();
void fileUpload(event) {
InputElement input = window.document.getElementById("fileUpload");
File file = input.files[0];
FileReader reader = FileReader();
reader.readAsText(file);
reader.onLoad.listen((fileEvent) {
contents = reader.result;
});
}
}
Вот как выглядит мой шаблон:
<h1>File upload test</h1>
<input type = "file" (change) = "fileUpload($event)" id = "fileUpload">
<div *ngIf = "contents != null">
<p>Hi! These are the contents of your file:</p>
<p>{{contents}}</p>
</div>
Если связанный ответ не решает вашу проблему, просто добавьте комментарий, и я отключу его.