Javascript 如何根据级别为[ag grid]的父id对行类别数据进行排序

我正在尝试根据父id对层次分类对象进行排序，然后根据该级别将其与父对象一起显示

这是我的东西看起来像

[{category_id: "168"
category_level: "1"
category_name: "Home"
parent_id: "1"},

{category_id: "166"
category_level: "1"
category_name: "Living"
parent_id: "1"},

{category_id: "171"
category_level: "2"
category_name: "Chairs"
parent_id: "168"},

{category_id: "172"
category_level: "3"
category_name: "Single Sofa"
parent_id: "170"},

{category_id: "169"
category_level: "1"
category_name: "Patio"
parent_id: "1"},

{category_id: "170"
category_level: "2"
category_name: "Sofa"
parent_id: "166"},

]

**JSON预期输出**

[{category_id: "168"
category_level: "1"
category_name: "Home"
parent_id: "1"},

{category_id: "169"
category_level: "1"
category_name: "Patio"
parent_id: "1"},

{category_id: "166"
category_level: "1"
category_name: "Living"
parent_id: "1"},


{category_id: "170"
category_level: "2"
category_name: "Sofa"
parent_id: "166"},

{category_id: "172"
category_level: "3"
category_name: "Single Sofa"
parent_id: "170"},

{category_id: "171"
category_level: "2"
category_name: "Chairs"
parent_id: "168"}]

输出应类似于

Home
Patio
Living
Living >> Sofa
Living >> Sofa >> Single Sofa
Living >> Chairs

我在这里使用ag网格，并尝试通过lodash.js解决它 以下是我用于在列定义中呈现单元格的代码：

var columnDefs = [
    {headerName: "", field: "icon", width:52},
    {headerName: "Categories",field:"category_name", width:1000, cellRenderer:function(params){

      function getParentIndex(pid)
      {
        var index = $scope.categories.map(function(el){
            return el.category_id;
        }).indexOf(pid);
        return index
      }

      var val="", parentIndex = getParentIndex(params.data.parent_id);

      if(parentIndex > -1)
      {

        val = $scope.categories[parentIndex].category_name + " >> " +params.data.category_name;
        var grandParentIndex = getParentIndex($scope.categories[parentIndex].parent_id);
        if(grandParentIndex > -1)
        {
          val = $scope.categories[grandParentIndex].category_name + " >> " + val;
        }
      }
      else {
        val = params.data.category_name;
      }
      return val;
    }},

    {headerName: "", field: "options", width:87, suppressMenu: true, onCellClicked(params){
      $scope.modifyOptions(params.data);
    }, template:"<a class='btn' href='javascript:void(0)'>options</a>"
  }
];

---

我建议首先构建一棵树，然后遍历分支，并为排序结果构建一个映射

var数据=[{category\u id:“168”，category\u-level:“1”，category\u-name:“Home”，parent\u-id:“1”，category\u-id:“1”，category\u-id:“171”，category\u-level:“2”，category\u-name:“Chairs”，parent\u-id:“168”，category\u-id:“172”，categegory\u-level:“3”，categegory\u-name:“Single沙发”，家长id:“170”}，{类别id:“169”，类别级别：“1”，类别名称：“天井”，家长id:“1”}，{类别id:“170”，类别级别：“2”，类别名称：“沙发”，家长id:“166”}，]，
分类，
tree={}，
map=[]；
data.forEach（函数（a，i）{
树[a.category_id]=树[a.category_id]|{}；
树[a.category\u id]。category\u id=a.category\u id；
树[a.category\u id]。索引=i；
树[a.parent_id]=树[a.parent_id]|{}；
tree[a.parent_id]。children=tree[a.parent_id]。children | |[]；
树[a.parent\u id].children.push（树[a.category\u id]）；
});
函数getChildren（o）{
o、 children.forEach（函数（a）{
map.push（a.index）；
a、 儿童和儿童（a）；
});
}
getChildren（树[1]）；//假设它以父\u id 1开头
排序=map.map（函数（a）{
返回数据[a]；
});
document.write（''+JSON.stringify（排序，0,4）+''）
var parentId = 1;
  var sortedList = [];
  var byParentsIdsList = _.groupBy(scope.categories, "parent_id"); // Create a new array with objects indexed by parentId

        while (byParentsIdsList[parentId]) {
            sortedList.push(byParentsIdsList[parentId][0]);
            parentId = byParentsIdsList[parentId][0].category_id;
        }


  scope.categories = sortedList;