angularjs 导出excel php,angularjs 导出excel指令 -凯发k8官方网
excel导出思路
项目中使用到了导出excel功能,潘老师已经在博客中将表格导出为csv的技术难点实现,剩下的,只是根据实际的业务需求对该指令进行完善。
大体遇到了以下几个问题:
功能按钮不导出
因为原指令默认导出表格所有的内容,第一次直接导出时,发现直接将查看、编辑这几个按钮的html代码都导出去了,我们要的应该是人员信息和人员资质信息。
指令添加参数:有效数据列数。
如图,这里的有效数据列就是市、区县等等一直到有效期至,一共15列,作为参数传给导出指令。
self.exportcols = scope.exportcols;
for (let i = 0; i < table.rows.length; i ) {
// 获取每行的数据
var rowdata = table.rows[i].cells;
// 如果该列为正常列,循环内容
for (let j = 0; j < self.exportcols; j ) {
// 如果该列不存在,则赋值为空内容
var data = rowdata[j] === undefined ? '' : rowdata[j].innerhtml;
// 拼接内容,用逗号分隔
csvstring = csvstring data ",";
}
// 删除最后多余的逗号
csvstring = csvstring.substring(0, csvstring.length - 1);
// 每行末尾添加\n进行换行
csvstring = csvstring "\n";
}
原来内层循环的是所有数据列,现在改成传入的有效数据列数。
跨行表格
以这个图为例,第一行是有15列的,但是第二行的数据只有4列,因为其余的列是第一行设置rowspan显示的,实际上第二行的tr中只有人员资质4个td。
这就导致导出的时候第二行只有四个数据,并且是从左对齐的,所以我们需要在跨行的列添加空数据。
加一个条件判断,传入出现被跨行的列时剩余列的长度,用于区分是正常列还是被跨行的列。
if (self.isnormalitem(rowdata)) {
// 如果该列为正常列,循环内容
for (let j = 0; j < self.exportcols; j ) {
// 如果该列不存在,则赋值为空内容
var data = rowdata[j] === undefined ? '' : rowdata[j].innerhtml;
// 拼接内容,用逗号分隔
csvstring = csvstring data ",";
}
} else {
// 根据有效数据中的跨行列拼接空数据
for (let j = 0; j < self.multiplerowcols; j ) {
csvstring = csvstring ",";
}
// 根据有效数据减去跨行列,获得非跨行列,并拼接数据
for (let index = 0; index < self.exportcols - self.multiplerowcols; index ) {
csvstring = csvstring rowdata[index].innerhtml ",";
}
}
资格证出现空列
因为这里需要为添加资格证按钮添加一个空列,导出的时候也会出现空列,效果并不好。
所以需要进行判断,当出现被跨行的列时,需要判断它的上一行的最后四项内容是否为空,如果为空,就应该把这个列的内容放到上一行。
if (self.isnormalitem(rowdata)) {
// 如果该列为正常列,循环内容
...
} else if (self.isfirstitem(csvstring)) {
// 如果当前跨行资质是当前人员的第一个资质,则将该资质添加到上一行
// 因为能添加人员资质的界面第一行的人员资质是空的,所以需要将该资
// 质添加到上一行
csvstring = self.adddatatoprestring(rowdata, csvstring);
} else {
// 根据有效数据中的跨行列拼接空数据
...
}
再加一个else,如果当前被跨行的列是当前人员的第一个人员资质的话,就把这一行的人员资质数据添加到上一行人员资质的空白处。
下面是方法的具体实现:
// 判断当前表格中资质是否是第一项资质
self.isfirstitem = function(string) {
// 分隔字符串
var csvarray = string.split(',');
// 循环已有字符数组的倒数四个元素,判断是否有效
for (var i = csvarray.length - 1; i >= csvarray.length - 4; i--) {
if (self.isvalid(csvarray[i])) {
return false;
}
}
return true;
};
// 判断当前字符是否有效
// 空字符和\n视为无效
self.isvalid = function(char) {
if (char === '' || char === '\n') {
return false;
} else {
return true;
}
};
// 添加数据到字符串的上一行
self.adddatatoprestring = function(data, string) {
// 字符串分隔为数据
var csvarray = string.split(',');
// 循环,将有效的数据添加到上一行
for (let i = 0; i < self.validnomultiplerowcols; i ) {
csvarray[csvarray.length - self.validnomultiplerowcols i] = data[i].innerhtml;
}
// 数组转换为字符串
return csvarray.join(',');
};
最终实现导出的csv效果:
总结
以上是凯发k8官方网为你收集整理的angularjs 导出excel php,angularjs 导出excel指令的全部内容,希望文章能够帮你解决所遇到的问题。
- 上一篇: python中xlwt的局限,pytho
- 下一篇: php 连续点击事件,javascrip