import { Component<% if (!!viewEncapsulation) { %>, ViewEncapsulation<% }%><% if (changeDetection !== 'Default') { %>, ChangeDetectionStrategy<% }%> } from '@angular/core'; import { <% if(standalone) { %>MatTreeModule, <% } %>MatTreeFlatDataSource, MatTreeFlattener } from '@angular/material/tree'; import { FlatTreeControl } from '@angular/cdk/tree';<% if(standalone) { %> import { MatButtonModule } from '@angular/material/button'; import { MatIconModule } from '@angular/material/icon';<% } %> import { files } from './example-data'; /** File node data with possible child nodes. */ export interface FileNode { name: string; type: string; children?: FileNode[]; } /** * Flattened tree node that has been created from a FileNode through the flattener. Flattened * nodes include level index and whether they can be expanded or not. */ export interface FlatTreeNode { name: string; type: string; level: number; expandable: boolean; } @Component({ selector: '<%= selector %>',<% if (inlineTemplate) { %> template: ` <%= indentTextContent(resolvedFiles.template, 4) %> `,<% } else { %> templateUrl: './<%= dasherize(name) %>.component.html',<% } if (inlineStyle) { %> styles: ` <%= indentTextContent(resolvedFiles.stylesheet, 4) %> `<% } else { %> styleUrl: './<%= dasherize(name) %>.component.<%= style %>'<% } %><% if(!!viewEncapsulation) { %>, encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>, changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %><% if(standalone) { %>, imports: [MatTreeModule, MatButtonModule, MatIconModule]<% } else { %>, standalone: false<% } %> }) export class <%= classify(name) %>Component { /** The TreeControl controls the expand/collapse state of tree nodes. */ treeControl: FlatTreeControl; /** The TreeFlattener is used to generate the flat list of items from hierarchical data. */ treeFlattener: MatTreeFlattener; /** The MatTreeFlatDataSource connects the control and flattener to provide data. */ dataSource: MatTreeFlatDataSource; constructor() { this.treeFlattener = new MatTreeFlattener( this.transformer, this.getLevel, this.isExpandable, this.getChildren); this.treeControl = new FlatTreeControl(this.getLevel, this.isExpandable); this.dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener); this.dataSource.data = files; } /** Transform the data to something the tree can read. */ transformer(node: FileNode, level: number): FlatTreeNode { return { name: node.name, type: node.type, level, expandable: !!node.children }; } /** Get the level of the node */ getLevel(node: FlatTreeNode): number { return node.level; } /** Get whether the node is expanded or not. */ isExpandable(node: FlatTreeNode): boolean { return node.expandable; } /** Get whether the node has children or not. */ hasChild(index: number, node: FlatTreeNode): boolean { return node.expandable; } /** Get the children for the node. */ getChildren(node: FileNode): FileNode[] | null | undefined { return node.children; } }