blob: e1136da910d2f20c76e0ebc13becf5cef4d7b82d [file] [log] [blame]
import { Component<% if (!!viewEncapsulation) { %>, ViewEncapsulation<% }%><% if (changeDetection !== 'Default') { %>, ChangeDetectionStrategy<% }%> } from '@angular/core';
import { MatTreeFlatDataSource, MatTreeFlattener } from '@angular/material/tree';
import { of as observableOf } from 'rxjs';
import { FlatTreeControl } from '@angular/cdk/tree';
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 { %>
styleUrls: ['./<%= dasherize(name) %>.component.<%= style %>']<% } %><% if(!!viewEncapsulation) { %>,
encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>,
changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %>
})
export class <%= classify(name) %>Component {
/** The TreeControl controls the expand/collapse state of tree nodes. */
treeControl: FlatTreeControl<FlatTreeNode>;
/** The TreeFlattener is used to generate the flat list of items from hierarchical data. */
treeFlattener: MatTreeFlattener<FileNode, FlatTreeNode>;
/** The MatTreeFlatDataSource connects the control and flattener to provide data. */
dataSource: MatTreeFlatDataSource<FileNode, FlatTreeNode>;
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) {
return {
name: node.name,
type: node.type,
level: level,
expandable: !!node.children
};
}
/** Get the level of the node */
getLevel(node: FlatTreeNode) {
return node.level;
}
/** Get whether the node is expanded or not. */
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);
}
}