Daftar dan Belajar Sekarang!

Upload File di Angular 4

foto afrijaldz
212 Kontribusi 78 Coto
1 tahun yang lalu
teman-teman mau tanya, ada yang pernah upload file di angular? untuk mengambil value dari filename nya gimana ya? biar bisa masuk ke formControlName dan dikirim pakai Api

Jawaban
foto rachmatsasongko
410 Kontribusi 420 Coto
1 tahun yang lalu
sudah pernah coba ng-file-upload gan? https://github.com/danialfarid/ng-file-upload saya pakai di project saya, lumayan mudah implementasinya

foto ardyhim
289 Kontribusi 169 Coto
1 tahun yang lalu
ini contoh upload file.
export class HomePage {
  loadProgress:any = 0;
  constructor(public navCtrl: NavController, private zone: NgZone) {
  }

  upload(e){
    let file = e.target.files[0];
    let formData: FormData = new FormData();
    let xhr: XMLHttpRequest = new XMLHttpRequest();
    xhr.setRequestHeader('authorization', window.localStorage.getItem('token'));
    formData.append("file", file);
    xhr.onreadystatechange = () => {
      if (xhr.readyState === 4) {
        if (xhr.status === 200) {
          console.log(JSON.parse(xhr.response))
        } else {
          console.log(JSON.parse(xhr.response))
        }
      }
    };

    xhr.upload.onprogress = (event) => {
      this.zone.run(()=>{
        this.loadProgress = Math.round(event.loaded / event.total * 100);
      })
    };

    xhr.open('POST', 'http://localhost:3000/upload', true);
    xhr.send(formData);
  }

}
<ion-content padding>
  <ion-list>
    <ion-item>
      <input type="file"(change)="upload($event)">
    </ion-item>
    <progressbar [progress]="loadProgress"></progressbar>
  </ion-list>
</ion-content>

foto afrijaldz
212 Kontribusi 78 Coto
1 tahun yang lalu
Maap baru sempet buka wkwkw udah solved gan, ane sempet pake ng2-file-upload tp ada masalah sama file keynya, jadi pakai angular2-dropzone-wrapper


Login untuk diksusi di forum sekolah koding