import { Injectable } from '@angular/core';
function invorkLoadProxy(ifr, cache, callBackFn, resolve){
let fn = function(){
if (ifr.$$eventFn){
ifr.removeEventListener('load', ifr.$$eventFn);
}
let r = cache || [];
r.forEach((r)=>{
document.body.removeChild(r);
})
callBackFn();
resolve(true);
}
ifr.$$eventFn = fn;
ifr.addEventListener('load', fn);
}
/**
* 下载服务
* @auther xiufu.wang
*/
@Injectable()
export class MbDownloadService {
constructor() {}
post(url: string, params?: {[name: string]: Array<string | number>| string | number}){
return new Promise((resolve, reject)=>{
let cache = [];
params = params || {};
let ifr = this.createHtmlDocumentAndAppendBody('iframe', {name: 'ng2downloadIframe', src: 'about:blank'}, cache);
ifr.style.display = 'none';
invorkLoadProxy(ifr, cache, ()=>{this.onDownLoad();}, resolve);
let formCtrl:any = this.createHtmlDocumentAndAppendBody('form', {target: 'ng2downloadIframe', action: url, method: 'POST'}, false);
for (var key in params){
if (params[key] !== undefined && params.hasOwnProperty(key)){
let v = params[key];
if (Array.isArray(v)){
v = v.join(',');
}
formCtrl.appendChild(this.createHtmlDocument('input', {type: 'hidden', name: key, value: v}, false));
}
}
formCtrl.submit();
document.body.removeChild(formCtrl);
});
}
get(url: string, params?: {[name: string]: Array<string | number>| string | number}){
return new Promise((resolve, reject)=>{
let cache = [];
params = params || {};
let ifr = this.createHtmlDocumentAndAppendBody('iframe', {name: 'ng2downloadIframe', src: 'about:blank'}, cache);
ifr.style.display = 'none';
invorkLoadProxy(ifr, cache, ()=>{this.onDownLoad();}, resolve);
let urlParams = '_doc='+ new Date().getTime();
for (let key in params){
if (params.hasOwnProperty(key) && params[key]){
let v = params[key];
if (Array.isArray(v)){
v = v.join(',');
}
urlParams = urlParams + '&' + key + '=' + v;
}
}
let p = url.indexOf('?') > 0 ? ('&' + urlParams) : ('?' + urlParams)
ifr.setAttribute('src', url + p);
});
}
private onDownLoad(){}
private createHtmlDocument(tagName, context, cache){
context = context || {};
let el = document.createElement(tagName);
for (let key in context){
if (context.hasOwnProperty(key) && context[key]){
el.setAttribute(key, context[key]);
}
}
if (cache){
cache.push(el);
}
return el;
}
private createHtmlDocumentAndAppendBody(tagName, context, cache){
let el = this.createHtmlDocument(tagName, context, cache);
document.body.appendChild(el);
return el;
}
private bindEventListener(el, type, func){
el.removeEventListener(type, func);
el.addEventListener(type, func);
}
}
分享到:
相关推荐
The in-depth, complete, and up-to-date book on Angular 6. Become an Angular 6 expert today.
Angular-angular2-image-gallery.zip,使用Angular 8 、node.js和GraphicsMagAngular 2图像库构建的图像库,Angularjs于2016年发布,是Angularjs的重写版。它专注于良好的移动开发、模块化和改进的依赖注入。angular的...
Angular-angular-starter.zip,使用Typescript(更新为4.4.3)的Gulp角起动器,Angularjs于2016年发布,是Angularjs的重写版。它专注于良好的移动开发、模块化和改进的依赖注入。angular的设计目的是全面解决开发人员...
包括 .idea ajax angular es5-6-7 html+css html5+css3 javaScript modular node react vue zepro 前端优化以及项目构建等教程
别的网站上下载的资源,是ng book2的r68版本(2018年5月8号出的),给自己做个备份
angular-1.6.0.zip
angular2工程搭建 一、编译和运行环境搭建 1、node.js和npm安装 a、下载地址:https://nodejs.org/en/download/ b、通过node -v 和 npm -v检查是否正确安装 c、下载工程: 略 d、进入工程目录 cd ...
网络搜集资源,想了解angular2发展,及入门学习的可以作为不错的读物
[angular2权威教程英文版]ng-book.2.Angular.4.r60.2017.4.pdf 随书代码地址:http://download.csdn.net/detail/xinconan1992/9853043
关于视频课程本课程将带您进入一个旅程,在该旅程中,您将学习如何使用Angular(以前称为Angular 2,现在只是Angular)以及Node.js,Express和MongoDB创建现代,可伸缩和高速的Web应用程序。 Angular 1和Node.js以及...
angular . module ( 'app' , [ 'ngDownload' ] ) ; 在您的html中实现指令: < button ng-download =" {{urlToPublicFile}} " params =" optionalParameters " > Download </ button > ...
Angular CLI + Truffle Starter Dapp;在以太坊区块链上编写,编译和部署智能合约
安装NodeJ: ://nodejs.org/en/download/package-manager/ 建立在Angular上 11.2.4 描述 用例 将标准字符串动态编译为功能齐全的Angular组件。 支持导入,导出和标准上下文。 安装 npm install --save p3x-angular-...
Angular 11示例服务器端渲染 一个具有和的Angular入门工具包 它是一个回购系列的一部分,该系列旨在使用Angular创建Web应用程序。 Web应用程序实时演示 快速开始 # choose a repo # download the example or clone ...
download the file https://raw.githubusercontent.com/huyinghuan/angular-bind-hash/master/angular-bind-hash.js 入门 包括 angularjs 和 angular-bind-hash.js 示例: < script src =" lib/angular.min.js...
Angular 11示例PWA 具有和的Angular入门工具包它是一个回购系列的一部分,该系列旨在使用Angular创建渐进式Web应用程序Web应用程序实时演示快速开始# choose a repo# download the example or clone the repo from ...
英文原版,非常好的一本书,适合学习angular的开发人员。Before reading this book, you should be familiar with the basics of web development, have an understanding of how HTML and CSS work, and, ideally, ...
Angular 11示例传输状态一个具有和的Angular入门工具包它是一个回购系列的一部分,该系列旨在使用Angular创建渐进式Web应用程序Web应用程序实时演示快速开始# choose a repo# download the example or clone the ...
Angular 11示例HttpClient 一个具有和的Angular入门工具包 它是一个回购系列的一部分,该系列旨在使用Angular创建渐进式Web应用程序 Web应用程序实时演示 快速开始 # choose a repo # download the example or ...
Angular 11示例SEO 一个具有和的Angular入门工具包 它是一个回购系列的一部分,该系列旨在使用Angular创建渐进式Web应用程序 Web应用程序实时演示 快速开始 # choose a repo # download the example or clone the ...