diff --git a/src/lib/schematics/tree/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts b/src/lib/schematics/tree/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts index 9689a630b719..322971aec3c2 100644 --- a/src/lib/schematics/tree/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts +++ b/src/lib/schematics/tree/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts @@ -4,15 +4,18 @@ import { of as observableOf } from 'rxjs'; import { FlatTreeControl } from '@angular/cdk/tree'; import { files } from './example-data'; -/** File node data with nested structure. */ +/** File node data with possible child nodes. */ export interface FileNode { name: string; type: string; children?: FileNode[]; } -/** Flat node with expandable and level information */ -export interface TreeNode { +/** + * 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; @@ -61,13 +64,13 @@ export interface TreeNode { export class <%= classify(name) %>Component { /** The TreeControl controls the expand/collapse state of tree nodes. */ - treeControl: FlatTreeControl; + treeControl: FlatTreeControl; /** The TreeFlattener is used to generate the flat list of items from hierarchical data. */ - treeFlattener: MatTreeFlattener; + treeFlattener: MatTreeFlattener; /** The MatTreeFlatDataSource connects the control and flattener to provide data. */ - dataSource: MatTreeFlatDataSource; + dataSource: MatTreeFlatDataSource; constructor() { this.treeFlattener = new MatTreeFlattener( @@ -75,8 +78,8 @@ export class <%= classify(name) %>Component { this.getLevel, this.isExpandable, this.getChildren); - - this.treeControl = new FlatTreeControl(this.getLevel, this.isExpandable); + + this.treeControl = new FlatTreeControl(this.getLevel, this.isExpandable); this.dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener); this.dataSource.data = files; } @@ -91,23 +94,23 @@ export class <%= classify(name) %>Component { }; } - /** Get the level of the node */ - getLevel(node: TreeNode) { + /** Get the level of the node */ + getLevel(node: FlatTreeNode) { return node.level; } /** Get whether the node is expanded or not. */ - isExpandable(node: TreeNode) { + isExpandable(node: FlatTreeNode) { return node.expandable; }; + /** Get whether the node has children or not. */ + hasChild(index: number, node: FlatTreeNode){ + return node.expandable; + } + /** Get the children for the node. */ getChildren(node: FileNode) { return observableOf(node.children); } - - /** Get whether the node has children or not. */ - hasChild(index: number, node: TreeNode){ - return node.expandable; - } } diff --git a/src/lib/schematics/tree/files/__path__/__name@dasherize@if-flat__/example-data.ts b/src/lib/schematics/tree/files/__path__/__name@dasherize@if-flat__/example-data.ts index d7cf78319952..c158305c475e 100644 --- a/src/lib/schematics/tree/files/__path__/__name@dasherize@if-flat__/example-data.ts +++ b/src/lib/schematics/tree/files/__path__/__name@dasherize@if-flat__/example-data.ts @@ -10,6 +10,7 @@ export const files = [ children: [ { name: 'cdk', + type: 'folder', children: [ { name: 'package.json', type: 'file' }, { name: 'BUILD.bazel', type: 'file' },