İşte benim HTML formum:
<form name="myForm" ng-submit="">
<input ng-model='file' type="file"/>
<input type="submit" value='Submit'/>
</form>
Yerel makineden bir resim yüklemek istiyorum ve yüklenen dosyanın içeriğini okumak istiyorum. Tüm bunları AngularJS kullanarak yapmak istiyorum.
$scope.file` değerini yazdırmaya çalıştığımda tanımsız olarak geliyor.
Buradaki yanıtlardan bazıları FormData()
kullanılmasını önermektedir, ancak ne yazık ki bu Internet Explorer 9 ve altında bulunmayan bir tarayıcı nesnesidir. Bu eski tarayıcıları desteklemeniz gerekiyorsa, <iframe>
veya Flash kullanmak gibi bir yedekleme stratejisine ihtiyacınız olacaktır.
Dosya yükleme işlemini gerçekleştirmek için zaten birçok Angular.js modülü var. Bu ikisi eski tarayıcılar için açık desteğe sahiptir:
Ve diğer bazı seçenekler:
Bunlardan biri projenize uygun olabilir ya da kendi kodunuzu nasıl yazacağınız konusunda size fikir verebilir.
Aşağıda çalışan dosya yükleme örneği bulunmaktadır:
Bu fonksiyonda
setFiles
Denetleyicideki dosya dizisini güncelleyecek olan View'dan
veya
AngularJS kullanarak jQuery Dosya Yükleme'yi kontrol edebilirsiniz
[
]() chrome ve IE'de iyi çalışıyor (CSS'yi background-image'de biraz güncellerseniz). Bu, ilerleme çubuğunu güncellemek için kullanılır: scope.progress = Math.round(evt.loaded * 100 / evt.total)
ancak FireFox'ta angular'ın [yüzde] verileri DOM'da başarılı bir şekilde güncellenmiyor, ancak dosyalar başarıyla yükleniyor.