使用方法:
第一步:安装 ng2-file-upload
npm install ng2-file-upload --save
第二步:在需要使用该插件的页面的对应module文件的imports中引入CommonModule 和 FileUploadModule
@NgModule({
imports:[
...
FileUploadModule
...
]
)
第三步:在对应的组件文件中引入并声明;
import { FileUploadModule} from " ng2-file-upload";
public uploader: FileUploader = new FileUploader({
authToken: 'Bearer ' + localStorage.getItem('id_token'),
url: systemconst.api_url + 'device/UploadFile',
additionalParameter:{
token:'token',//token值
}
});
插件方法:
一、获取文件流:
1、可以在fileItem中获取到。
this.uploader.onBuildItemForm=function(fileItem,form){
form.append('name',fileItem.file.name);
form.append('name',fileItem.file.size);
}
2、自定义传ID或者文件外其他值
this.uploader.setOptions({additionalParameter:{'id':this.id}})
注:使用此方法头部token需要设置header加参数 否则直接写入authToken参数就可传token
二、上传
this.uploader.queue[i].upload(); upload()。
注:批量上传就是调多次的单个上传方法。
三、上传时加消息头(加token值)
格式:
1、headers : [{name:"Authorization",value:this.token}]
2、authToken: this.token,
四、队列操作
1、移除上传的列队
this.uploader.clearQueue();
2、添加上传队列
this.uploader.addToQueue(files);