基于ngx-datatable自定义表格

	由于客户需求，移动端由原生页面改为h5版，虽然h5了解不多，但觉得自己还可以抢救一下的，核心技术全靠百度嘛！不慌！也希望各位大佬能点评下。实现效果如下：

一、开发前的想法

起初了解到原生页面使用的第三方控件 ，于是便开始百度生涯，蓦然回首，ngx-datatable在灯火阑珊处。ngx-datatable是一个用于呈现大型复杂数据的Angular组件，具体不赘述，网上教程很多也全面

二、布局构思

红圈一部分

红圈1部分是固定不动，红圈2部分支持左右滑动，其实ngx-datatable是支持这种样式的，但是起初考虑到1部分里面有定制的元素，于是果断放弃ngx-datatable提供的功能，使用ion-list。这块的难点主要还是根据数据构造页面元素的层级结构，并且支持折叠功能（新增和删除）。部分代码如下：

层级关系

getRowArray(arr,padding) {
    // tempdatas
    if(arr == undefined) return;
    for(var i=0;i<arr.length;i++) {
   
      var obj= arr[i];
      obj['level'] = 15+padding; // level来控制元素左侧距离
      obj['showinfo'] = obj.rows.length>0;
      obj['open'] = false;  // open控制图片是'+'或'-'
      this.tempdatas.push(obj);
      var subArr = obj["rows"];
      if(subArr.length>0){
   
        this.tempdatas.concat(this.getRowArray(obj["rows"],obj.level));
      }
    }
  }

折叠功能（代码量较大就不赘述）

html部分有点粗糙😓待提炼，如下：