Ecco il mio modulo HTML:
<form name="myForm" ng-submit="">
<input ng-model='file' type="file"/>
<input type="submit" value='Submit'/>
</form>
Voglio caricare un'immagine dalla macchina locale e voglio leggere il contenuto del file caricato. Tutto questo voglio farlo usando AngularJS.
Quando provo a stampare il valore di $scope.file
viene come undefined.
Alcune delle risposte qui propongono di usare FormData()
, ma sfortunatamente questo è un oggetto del browser non disponibile in Internet Explorer 9 e inferiori. Se hai bisogno di supportare quei vecchi browser, avrai bisogno di una strategia di backup come l'utilizzo di <iframe>
o Flash.
Ci sono già molti moduli Angular.js per eseguire il caricamento dei file. Questi due hanno un supporto esplicito per i vecchi browser:
E alcune altre opzioni:
Uno di questi dovrebbe essere adatto al tuo progetto, o potrebbe darti qualche idea su come codificarlo da solo.
Qui sotto c'è un esempio funzionante di caricamento di file:
In questa funzione chiamata
setFiles
From View che aggiornerà l'array di file nel controller
o
Puoi controllare jQuery File Upload usando AngularJS
[
]() funziona bene in chrome e IE (se si aggiorna un po' il CSS in background-image). Questo è usato per aggiornare la barra di avanzamento: scope.progress = Math.round(evt.loaded * 100 / evt.total)
ma in FireFox i dati [percent] di Angular non vengono aggiornati con successo nel DOM, anche se i file vengono caricati con successo.