Dosya Yükleme Yöntemi
- ng2-file-upload:
ng2-file-upload, dosyaları form verisi (FormData) olarak yükler ve aynı zamanda yükleme sırasında ilerleme (progress) bilgisi sağlar. Bu, kullanıcıya yükleme sürecini takip etme imkanı tanır. - ng-file-upload:
ng-file-upload, dosyaları form verisi (FormData) olarak yükler. Bu, dosyaların arka uç sunucusuna standart bir HTTP isteği ile gönderilmesini sağlar. - ngx-file-drop:
ngx-file-drop, dosyaları sürükleyip bırakma (drag-and-drop) yöntemi ile yükler. Kullanıcılar dosyaları doğrudan bir alana sürükleyerek yükleme işlemini başlatabilir.
Yükleme İlerlemesi
- ng2-file-upload:
ng2-file-upload, yükleme ilerlemesini gösterir. Yükleme işlemi sırasında ilerleme yüzdesini hesaplayarak kullanıcıya görsel bir geri bildirim sağlar. - ng-file-upload:
ng-file-upload, yükleme ilerlemesini göstermez. Ancak, yükleme işlemi sırasında ilerleme bilgisi almak için özel kod yazmak mümkündür. - ngx-file-drop:
ngx-file-drop, yükleme ilerlemesini göstermez. Ancak, sürükleyip bırakma özelliği ile kullanıcıya yükleme işleminin başladığını belirtir.
Hata Yönetimi
- ng2-file-upload:
ng2-file-upload, hata yönetimi için daha kapsamlı bir yapı sunar. Yükleme sırasında oluşan hataları yakalayarak kullanıcıya bildirimde bulunabilir. - ng-file-upload:
ng-file-upload, temel hata yönetimi sağlar. Yükleme işlemi sırasında oluşan hataları yakalamak için geliştiricinin özel kod yazması gerekir. - ngx-file-drop:
ngx-file-drop, hata yönetimi konusunda sınırlıdır. Yükleme sırasında oluşan hataları yakalamak için geliştiricinin özel kod yazması gerekir.
Sürükleyip Bırakma Desteği
- ng2-file-upload:
ng2-file-upload, sürükleyip bırakma desteği sunar. Kullanıcılar dosyaları bir alana sürükleyerek yükleme işlemini başlatabilir. - ng-file-upload:
ng-file-upload, sürükleyip bırakma desteği sunmaz. Dosyaların yalnızca dosya seçici (file input) aracılığıyla yüklenmesi gerekmektedir. - ngx-file-drop:
ngx-file-drop, sürükleyip bırakma desteği sunar. Bu özellik, kullanıcıların dosyaları daha hızlı ve kolay bir şekilde yüklemesine olanak tanır.
Örnek Kod
- ng2-file-upload:
ng2-file-uploadile Yükleme İlerlemesi Gösterme<input type="file" ng2FileSelect [uploader]="uploader" /> <button (click)="uploader.uploadAll()">Tümünü Yükle</button> <div *ngFor="let item of uploader.queue"> <div>{{ item.file.name }}</div> <div *ngIf="item.progress">İlerleme: {{ item.progress }}%</div> </div> - ng-file-upload:
ng-file-uploadile Basit Dosya Yükleme<input type="file" ngf-select ng-model="myFile" name="file" /> <button ng-click="uploadFile(myFile)">Yükle</button> - ngx-file-drop:
ngx-file-dropile Sürükleyip Bırakma<ngx-file-drop (onFileDrop)="onFileDrop($event)"> <ngx-file-drop-zone> Dosyaları buraya sürükleyin veya tıklayın </ngx-file-drop-zone> </ngx-file-drop>