Hoi Angelo,
Klein voorbeeldje voor je gemaakt. Here is a small sample repo
<https://github.com/SanderElias/treedemo>
Your data structure isn't that clean, and open for interpretation. I
reworked it into a tree with a function like this:
function toTree(acc, item) {
if (last === undefined) {
acc = {
items: [item],
depth: 0,
children: { items: [], depth: 1 }
};
last = acc;
return acc;
}
if (last.depth !== item.depth) {
last = last.children;
last.depth = item.depth;
last.children = { items: [], depth: undefined };
}
last.items.push(item);
return acc;
}
When that's done, you can use the result to render it with a simple
recursive component like:
@Component({
selector: 'app-tree',
template: `
<ul>
<li *ngFor="let i of item.items">{{i.clean_category_name}}</li>
<li *ngIf="item.children.items.length>0">
<app-tree [item]=item.children></app-tree>
</li>
</ul>
`,
styles: []
})
export class TreeComponent implements OnInit {
@Input() item;
}
If you check out the repo, there is a complete working project in there.
Regards
Sander
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
