How to use ng2-file-upload - 10 common examples
To help you get started, we’ve selected a few ng2-file-upload examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
OmicsDI / ddi-web-app / src / app / profile / profile-info-profile / profile-info-profile.component.ts View on Github 
ngOnChanges(changes: SimpleChanges) {
for (const propName of Object.keys(changes)) {
const chng = changes[propName];
const cur = JSON.stringify(chng.currentValue);
const prev = JSON.stringify(chng.previousValue);
// console.log(`${propName}: currentValue = ${cur}, previousValue = ${prev}`);
if (propName === 'profile') {
if (null != chng.currentValue) {
console.log(`profile-info ngOnChanges: ${chng.currentValue.userId}`);
this.profile = chng.currentValue;
this.profileImageUrl = this.getProfileImageUrl();
this.uploader = new FileUploader({url: this.appConfig.getProfileUploadImageUrl(this.profile.userId)});
this.uploader.onCompleteItem = (item: any, response: any, status: any, headers: any) => {
this.profileImageUrl = this.getProfileImageUrl();
};
}
}
}
}ngOnChanges(changes: SimpleChanges) {
for (const propName of Object.keys(changes)) {
const chng = changes[propName];
const cur = JSON.stringify(chng.currentValue);
const prev = JSON.stringify(chng.previousValue);
// console.log(`${propName}: currentValue = ${cur}, previousValue = ${prev}`);
if (propName === 'profile') {
if (null != chng.currentValue) {
console.log(`profile-info ngOnChanges: ${chng.currentValue.userId}`);
this.profile = chng.currentValue;
this.profileImageUrl = this.getProfileImageUrl();
this.uploader = new FileUploader({url: this.appConfig.getProfileUploadImageUrl(this.profile.userId)});
this.uploader.onCompleteItem = (item: any, response: any, status: any, headers: any) => {
this.profileImageUrl = this.getProfileImageUrl();
};
}
}
}
}ngOnInit() {
if (window.screen.width < 960) {
this.globalService.closeSideNav(); // 手机屏幕默认隐藏sideNav
}
this.userLogin = this.principal.getCurrentAccount().login;
this.taskUuid = uuid().replace(/-/g, '').toLowerCase();
this.uploader = new FileUploader({
url: SERVER_API_URL + 'zuul/umu/api/modelfile/' + this.taskUuid,
method: 'POST',
itemAlias: this.userLogin,
queueLimit: 1,
});
this.uploader.onBeforeUploadItem = (fileItem) => {
fileItem.headers.push({name: 'X-XSRF-TOKEN', value: this.cookieService.get('XSRF-TOKEN')});
return fileItem;
};
}profile => {
console.log('getting profile');
this.userId = profile.userId;
// this.getConnections(this.userId);
// this.getCoAuthors(this.userId);
this.uploader = new FileUploader({url: this.appConfig.getProfileUploadImageUrl(this.userId)});
this.uploader.onCompleteItem = (item: any, response: any, status: any, headers: any) => {
this.profileImageUrl = this.getProfileImageUrl();
};
this.profileImageUrl = this.getProfileImageUrl();
}
);constructor(private broadCaster: EventBroadcaster,
private userService: UserService,
private workspaceService: WorkspaceService,
protected element: ElementRef,
protected injector: Injector) {
super(element, injector);
// 이미지 업로드 URL 설정
this.uploader
= new FileUploader({ url: CommonConstant.API_CONSTANT.API_URL + 'images/upload' });
}constructor(private userService: UserService,
protected elementRef: ElementRef,
protected injector: Injector,
protected renderer: Renderer2) {
super(elementRef, injector);
// 이미지 업로드 URL 설정
this.uploader
= new FileUploader({ url: CommonConstant.API_CONSTANT.API_URL + 'images/upload' });
}this.ngZone.run(function () {
if (!_this.uploader && !_this.options) {
throw new Error('You must pass either an uploader instance or options.');
}
// if options were passed, init a new uploader
if (!_this.uploader && _this.options) {
_this.uploader = new FileUploader(_this.options);
}
// always remove after upload for this case
_this.uploader.options.removeAfterUpload = true;
_this.uploader.onAfterAddingFile = _this.onAfterAddingFile.bind(_this);
_this.uploader.onBeforeUploadItem = _this.onBeforeUploadItem.bind(_this);
_this.uploader.onProgressAll = _this.onProgressAll.bind(_this);
_this.uploader.onSuccessItem = _this.onSuccessItem.bind(_this);
_this.uploader.onErrorItem = _this.onErrorItem.bind(_this);
});
};profile => {
this.logger.debug('getting profile');
this.userId = profile.userId;
// this.getConnections(this.userId);
// this.getCoAuthors(this.userId);
this.uploader = new FileUploader({url: this.appConfig.getProfileUploadImageUrl(this.userId)});
this.uploader.onCompleteItem = (item: any, response: any, status: any, headers: any) => {
this.profileImageUrl = this.getProfileImageUrl();
};
this.profileImageUrl = this.getProfileImageUrl();
}
);ngOnChanges() {
if(this.uploader){
this.uploader.destroy();
this.uploader = new FileUploader({url: this.URLUPLOAD, maxFileSize: Constants.FILE_SIZE_LIMIT});
this.uploader.onCompleteItem = (item:any, response:string, status:number, headers:any)=> {
console.log("File uploaded...");
this.onCompleteFileUpload.emit(response);
}
this.uploader.onWhenAddingFileFailed = (fileItem) => {
this.handleFileSizeError();
}
}
}ngOnInit() {
this.uploader = new FileUploader({url: this.URLUPLOAD, maxFileSize: Constants.FILE_SIZE_LIMIT});
this.uploader.onCompleteItem = (item:any, response:string, status:number, headers:any)=> {
console.log("File uploaded...");
this.onCompleteFileUpload.emit(response);
}
this.uploader.onWhenAddingFileFailed = (fileItem) => {
this.handleFileSizeError();
}
}
