Question

我正在寻找一种构建经过身份验证的树节点的方法，以便能够根据用户角色显示和隐藏节点。当前，如果when：结果为true，则可以将其设置为不呈现树节点的内部部分，但仍会呈现mat-tree-node组件，这是我不希望的。

我想扩展MatTreeNodeDef并添加一个额外的输入here，但是CDKTree只允许使用1个defaultNode，而这不是一个时间。

if (defaultNodeDefs.length > 1) {
  throw getTreeMultipleDefaultNodeDefsError();
}

任何想法都将不胜感激。

Answer 1

您可以改为更改树数据。您可以根据用户角色构建树数据。

这是一个基本示例：

在模板中：

<cdk-tree [dataSource]="dataSource" [treeControl]="treeControl">
    ...
</cdk-tree>

在控制器中：

treeData: MenuNode[] = [];
dataSource: ArrayDataSource<MenuNode> = new ArrayDataSource(this.treeData);

private allNodes = [
  { name: 'Dashboard', pathName: 'dashboard' },
  { name: 'Admin Panel', pathName: 'admin' }
];

ngOnInit() {
  this.allNodes.forEach((node, i) => {
    if (this.hasAccess(node.pathName)) {
      this.treeData.push(this.allNodes[i]);
    }
  };

  this.dataSource = new ArrayDataSource(this.treeData);
}

hasAccess(path: string): boolean {
  // Check whether the current user has access to the path
  ...
}

具有已认证树节点的Angular Material Tree

1 个答案: