Forked from arciisine/Simple File Upload Component
Last active
January 8, 2018 22:37
-
-
Save tomalex0/c4c8f147011d5c06b4eae9699692a702 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Component, Input, AfterViewInit } from '@angular/core'; | |
import { NgModel, DefaultValueAccessor, NgControl } from '@angular/forms'; | |
import { Http, Headers, RequestOptions } from '@angular/http'; | |
@Component({ | |
selector: 'app-file-uploader', | |
template: '<input type="file" (change)="updated($event);">', | |
providers: [NgModel, DefaultValueAccessor] | |
}) | |
export class FileUploaderComponent implements AfterViewInit { | |
static ROOT = '/rest/asset'; | |
@Input() private companyId: string = ''; | |
private value: string; | |
private changeListener: Function; | |
constructor(private http: Http, private input: NgControl) { | |
this.input.valueAccessor = this; | |
} | |
ngAfterViewInit() { | |
} | |
writeValue(obj: any): void { | |
this.value = obj; | |
} | |
registerOnChange(fn: any): void { | |
this.changeListener = fn; | |
} | |
registerOnTouched(fn: any): void { | |
} | |
updated($event) { | |
const files = $event.target.files || $event.srcElement.files; | |
const file = files[0]; | |
const formData = new FormData(); | |
formData.append('file', file); | |
const headers = new Headers({}); | |
let options = new RequestOptions({ headers }); | |
let url = FileUploaderComponent.ROOT + (this.companyId ? '/' + this.companyId : ''); | |
this.http.post(url, formData, options).subscribe(res => { | |
let body = res.json(); | |
this.value = body.filename; | |
if (this.changeListener) { | |
this.changeListener(this.value); | |
} | |
}); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment