Estoy tratando de acceder al valor del archivo de entrada desde mi aplicación ionic 2, pero todavía me enfrento al problema de que los archivos de propiedades no existen en el tipo 'EventTarget'. Como funciona correctamente en js pero no en mecanografiado. El código se da a continuación:
document.getElementById("customimage").onchange= function(e?) { var files: any = e.target.files[0]; EXIF.getData(e.target.files[0], function() { alert(EXIF.getTag(this,"GPSLatitude")); }); }Ayúdenme a resolver este problema, ya que no está construyendo mi aplicación ionic 2.
Puedes lanzarlo como HTMLInputElement :
document.getElementById("customimage").onchange = function(e: Event) { let file = (<HTMLInputElement>e.target).files[0]; // rest of your code... }Actualizar:
También puedes usar esto:
let file = (e.target as HTMLInputElement).files[0];El tipo de propiedad e.target depende del elemento que está devolviendo en getElementById(...) . files es una propiedad del elemento de input : https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement
En este caso, el compilador de TypeScript no sabe que está devolviendo un elemento de input y no tenemos una clase de Event específica para esto. Entonces, puedes crear uno como el siguiente código:
interface HTMLInputEvent extends Event { target: HTMLInputElement & EventTarget; } document.getElementById("customimage").onchange = function(e?: HTMLInputEvent) { let files: any = e.target.files[0]; //... }Esto son más líneas, pero creo que es lo más claro.
const onChange = (event: Event) => { const target= event.target as HTMLInputElement; const file: File = (target.files as FileList)[0]; /** do something with the file **/ };Actualización de 2022: algunas personas han señalado correctamente que los dos moldes en la segunda línea son innecesarios, esto es totalmente correcto y revisé mi respuesta.
const onChange = (event: React.ChangeEvent) => { const target= event.target as HTMLInputElement; const file = target.files[0]; /** do something with the file **/ };