upload files with angular
fileChange(element) {
this.uploadedFiles = element.target.files;
}
upload() {
let formData = new FormData();
for (var i = 0; i < this.uploadedFiles.length; i++) {
formData.append("uploads[]", this.uploadedFiles[i], this.uploadedFiles[i].name);
}
this.http.post('/api/upload', formData)
.subscribe((response) => {
console.log('response received is ', response);
})
}image file upload in angular
import { Component, OnInit } from '@angular/core';
import { FileUploadService } from './file-upload.service';
@Component({
selector: 'app-file-upload',
templateUrl: './file-upload.component.html',
styleUrls: ['./file-upload.component.css']
})
export class FileUploadComponent implements OnInit {
// Variable to store shortLink from api response
shortLink: string = "";
loading: boolean = false; // Flag variable
file: File = null; // Variable to store file
// Inject service
constructor(private fileUploadService: FileUploadService) { }
ngOnInit(): void {
}
// On file Select
onChange(event) {
this.file = event.target.files[0];
}
// OnClick of button Upload
onUpload() {
this.loading = !this.loading;
console.log(this.file);
this.fileUploadService.upload(this.file).subscribe(
(event: any) => {
if (typeof (event) === 'object') {
// Short link via api response
this.shortLink = event.link;
this.loading = false; // Flag variable
}
}
);
}
}Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
