import { Component, Input, OnInit } from '@angular/core'; import { FormControl } from '@angular/forms'; import { takeUntil } from 'rxjs/operators'; import { BaseComponent } from '../../../core/common/base/base.component'; import { FileUploader } from '../../../shared/components/file-uploader/FileUploader'; @Component({ selector: 'app-fileuploader-component', templateUrl: './file-uploader.component.html' }) export class FileUploaderComponent extends BaseComponent implements OnInit { files: File | FileList; disabled = false; fileSelectMultipleMsg = 'No file(s) selected yet.'; @Input() public label = 'FILE-UPLOADER.DEFAULT'; @Input() public fileUploader: FileUploader; @Input() form: FormControl; ngOnInit(): void { } selectEvent(files: FileList | File): void { this.label = 'FILE-UPLOADER.UPLOAD'; if (files instanceof FileList) { const names: string[] = []; for (let i = 0; i < files.length; i++) { names.push(files[i].name); } this.fileSelectMultipleMsg = names.join(','); } else { this.fileSelectMultipleMsg = files.name; } } uploadEvent(files: FileList | File): void { const formdata: FormData = new FormData(); if (files instanceof FileList) { for (let i = 0; i < files.length; i++) { formdata.append('file', files[i]); } } else { formdata.append('file', files); } this.fileUploader.uploadFile(formdata) .pipe(takeUntil(this._destroyed)) .subscribe(fileitem => this.form.patchValue(fileitem)); } cancelEvent(): void { } }