mat-tree

[kara]

[RainingNight]

Quickly ! ! !

[vyakymenko]

Simple Material Design for tree:

Photoshop Source here

I can work on implementation after approve.

[vyakymenko]

Proposing code design:

JSON Example:

{
	"data": [{
		"label": "Tree Item Collapsed",
		"data": "Tree Item Collapsed Data",
		"expandIcon": "fa-folder-open",
		"collapseIcon": "fa-folder",
		"children": []
	}, {
		"label": "Tree Item Expanded",
		"data": "Tree Item Expanded Data",
		"expandIcon": "fa-folder-open",
		"collapseIcon": "fa-folder",
		"children": [{
			"label": "Bookmarks",
			"data": "Bookmarks Data",
			"icon": "fa-bookmarks"
		}, {
			"label": "Chart",
			"data": "Chart Data",
			"expandedIcon": "fa-chart"
		}]
	}, {
		"label": "Bookmarks",
		"data": "Bookmarks Data",
		"icon": "fa-bookmarks"
	}, {
		"label": "Chart",
		"data": "Chart Data",
		"expandedIcon": "fa-chart"
	}]
}

Attributes:
data - Data array of treenodes
selectionType - Selection type, "single", "multiple", maybe "checkbox?".
selection - Single treenode instance or an array to refer to the selections.
orientation - Tree orientation.

Events:
nodeExpand - Callback to invoke when a node is expanded.
nodeCollapse - Callback to invoke when a node is expanded.
nodeSelect - Callback to invoke when a node is unselected.
nodeUnselect - Callback to invoke when a node is selected.

Lazy Loading?

Drag-n-Drop?

[alvachien]

Looking forward to the release of the Tree!!

[vyakymenko]

Will try to implement this weekend.

[tinayuangao]

The tree component's design and implementation are in-progress.

[vyakymenko]

@tinayuangao , thanks for info, will wait for updates.

[RainingNight]

Too slowly!

[alvachien]

@vyakymenko The status for the tree in README.md still 'Not started'

[vyakymenko]

@alvachien , because I have not started it per comment from @tinayuangao:
The tree component's design and implementation are in-progress.

[alescdb]

While a official <md-tree> is developed, I find out "angular-tree-component".
It supports templates & themes (eg putting <md-icon> and/or <md-checkbox> into it)

https://angular2-tree.readme.io/docs