Material-tree is displaying nothing

[ouekalo]

I am looking why material-tree is displaying nothing. Here is my code

For Component

@component( selector: 'tree-root', directives: [MaterialTreeComponent], templateUrl: 'tree_component.html', styleUrls: ['tree_component.css'], changeDetection: ChangeDetectionStrategy.OnPush, ) class TreeComponent {

final SelectionOptions nestedOptions = data.nestedOptions;

ItemRenderer childItemRenderer = (String childTitle)=>childTitle.toUpperCase();

String itemRenderer(item) =>childItemRenderer(item);

@ViewChild(MaterialTreeComponent) MaterialTreeComponent materialTree; }

For tree Options

final _commonParentChildrenMap = { 'Animated Feature Films': [ OptionGroup([ 'Cinderalla', 'Alice In Wonderland', 'Peter Pan', 'Lady and the Tramp', ]) ], 'Live-Action Films': [ OptionGroup( ['Treasure Island', 'The Littlest Outlaw', 'Old Yeller', 'Star Wars']) ], 'Documentary Films': [ OptionGroup(['Frank and Ollie', 'Sacred Planet']) ], 'Star Wars': [ OptionGroup(['By George Lucas']) ], 'By George Lucas': [ OptionGroup(['A New Hope', 'Empire Strikes Back', 'Return of the Jedi']) ] };

/// An example data set of hierarchical data. final SelectionOptions nestedOptions = _NestedSelectionOptions([ OptionGroup( ['Animated Feature Films', 'Live-Action Films', 'Documentary Films']) ], _commonParentChildrenMap);

/// A slight restructure of [nestedOptions] to separate "Animated Feature Films" /// with the other two option groups. final SelectionOptions nestedOptionsVariation = _NestedSelectionOptions([ OptionGroup(['Animated Feature Films']), OptionGroup(['Live-Action Films']), OptionGroup(['Documentary Films']), ], _commonParentChildrenMap);

/// An example implementation of [SelectionOptions] with [Parent]. class _NestedSelectionOptions extends SelectionOptions implements Parent<T, List> { final Map<T, List> _children;

_NestedSelectionOptions(List options, this._children) : super(options);

@override bool hasChildren(T item) => _children.containsKey(item);

@override DisposableFuture<List> childrenOf(T parent, [_]) { print("$_children"); return DisposableFuture<List>.fromValue(_children[parent]); } }

Howto solve this issue.

[nshahan]

At a glance this looks like you are trying to recreate one of the examples from the gallery which do work. I tell if you are trying to do something different than what is show here: https://github.com/dart-lang/angular_components/tree/master/examples/material_tree_example

Can you describe what you are trying to do? Do you get errors during the build or at run time in the browser console?

Also as a helpful tip, use the code blocks to make source code you post more readable. Surround it triple ticks or use the button in the github UI:

formatted 
  code 
    looks 
      better 
        here.