这一节主要记录添加页面的功能,其实在做这个添加页面浪费了我不少时间,因为这个里面我遇到了几个问题,不过最后都一一解决了。
阅读目录:
1.主要问题
2.解决第一个问题:Tags分类显示
3.解决第二个问题:使用事务
4.前端angularjs处理
这做添加页面的时候遇到的第一个问题是tags分类显示的问题,问题描述如下:
1 id name pid 2 1 AA 0 3 2 BB 0 4 3 CC 0 5 4 DD 1 6 5 EE 1 7 6 FF 3 8 7 GG 2 9 8 HH 3 10 9 II 2 11 ................. 12 这个是表结构,总共也就几十条数据。
因为mysql不支持迭代查询sql,所以数据读出来之后是没有分类的,所以这个地方分类要我自己处理。
我遇到的第二个问题就是我在添加数据的时候是一次添加多笔数据,也就是要批量处理,其实批量处理也还好,主要是我想使用事务,而nodejs这方面有关mysql使用事务的资料却不多,我也是瞎子摸象。
解决第一个问题:Tags分类显示
这个问题我在上面已经描述过了,我显示出来的效果是这样的:
因为前端是使用angularjs,那么对数据的格式多少是有点要求的,所以我要把数据库里面读出来的列表转为一个数组,然后数组里面每个分类又是一个数组,大分类在数组的第一个位置,如这样:
[
[object1, object2, object3......], //这里第一个object是衣
[object4, object5, object6............], //这里的第一个object是食
[object4, object5, object6............],
................
]
我的做法是双层循环,拿第一个对象和后面的每个对象比较,如果自己的pid和别的pid相同并且pid不等于0的就是同一类,然后把找到的对象放到一个临时数组中并且做个标记,如果是自己的pid和别的id相同的,就说明这个是父类然后放到临时数组的第一个位置并且也做个标记。当内层循环第一次循环完之后,把整个临时数组都放到一个外围定义的数组里面然后就就开始做清除处理,把所有标记的对象都清除掉那么剩余的就是接下来其他的分类,然后再次进入循环。代码如下:
1 //temp就是数据库中读出的数组列表对象 2 function changeTags(temp){ 3 //存放结果的数组 4 var arr = new Array(); 5 6 //外围循环控制数组数量 7 for(var i=0, x=0;i<temp.length;i++){ 8 9 //临时数组存放每个单个数组项 10 var temparr = new Array(); 11 12 //查找相同对象并且标记 13 for(var j=x+1;j<temp.length;j++){ 14 15 //如果是父类就放到第一个位置 16 if(temp[x].pid == temp[j].id){ 17 temparr.unshift(temp[j]); 18 19 //标记这个项是处理过的 20 temp[j].mark = 'D'; 21 } 22 23 24 //如果是子类就放第一个的后面 25 if(temp[x].pid == temp[j].pid && temp[j].pid != 0){ 26 temparr[temparr.length] = temp[j]; 27 28 temp[j].mark = 'D'; 29 } 30 31 //本身也要放进数组 32 if(j == temp.length-1){ 33 temparr[temparr.length] = temp[x]; 34 35 temp[x].mark = 'D'; 36 } 37 } 38 39 //查找到的结果放到结果数组里 40 arr[arr.length] = temparr; 41 42 //清除标记的对象 43 for(var z=0, k=0;z<temp.length;z++){ 44 //判断前一个是否已经删除 45 if(k==0){ 46 z=0; 47 } 48 49 //如果是标记过的就删除 50 if(temp[z].mark == 'D'){ 51 //这里没有多余,这个属性也用不着 52 delete temp[z].mark; 53 54 //清除标记过的项 55 temp.splice(z, 1); 56 57 //归零,方便下次从0开始 58 k=0; 59 60 //继续操作 61 continue; 62 }else{ 63 //如果没有标记就累加,用于跳过 64 k++; 65 } 66 } 67 } 68 69 return arr; 70 }