如何在 angular ui 网格中使用树视图

Question

伙计们，我在我的项目中使用 angular ui 网格..这是我的代码：

 $scope.gridOptions = {
        enableSorting: false,
        enableRowSelection: true,
        multiSelect: false,
        exporterMenuCsv: false,
       // enableGridMenu: true,
        enableSelectAll: true,
        enableColumnResizing: true,
        enableSorting: true,

         onRegisterApi: function(gridApi) {
            $scope.gridApi = gridApi; //set gridApi on scope
             gridApi.core.on.renderingComplete($scope, function () {
              $timeout(function () {
                var gridBodyElem = document.getElementById(gridApi.grid.id + '-grid-container');
                gridBodyElem.addEventListener('mouseup', handleGridClick);
              });
            });
      },

columnDefs: [
      { field: 'name',displayName:'Name',cellClass: 'gridField'},
      { field: 'uniqueid',displayName:'ID',cellClass: 'gridField'},
      { field: 'devicetime',displayName:'GPS DATE',cellClass: 'gridField'},
      { field: 'adress',displayName:'Adresse',cellClass: 'gridField'},
      { field: 'company',displayName:'Company',cellClass: 'gridField'}
]

};

效果很好，但我想在此网格中使用树视图来获得如下 table 网格。

我真正想要的是，当我点击项目时，我想在下面显示一个 html 代码，就像上面的图片一样...有没有人知道如何做到这一点...？？

Answer 1

示例控制器：

var SomeController = function () {

    this.customHtml = '<ul><li>render me please</li></ul>';
}

示例视图：

<div ng:bind="customHtml"></div>

给出：

<div>
    "<ul><li>render me please</li></ul>"
</div>

如何在 angular ui 网格中使用树视图

How to use treeview with angular ui grid

html

css

angularjs

angular-ui-grid